Simple display random show
I have 5 picture (pic-1.jpg, pic-2.jpg... etc..) those 5 pic开发者_Python百科tures is loader into and array with text associated to the (caption) what i like to archive (with jquery or javascript) is : Get the order randomly each time the site is loaded, after hitting next, getting the next image without showing a one that have been show until the end.
I have think to use random to generate the first to display, and a push to get the other one
Do you have anothe better function... to random without repeat until show all once...
is it clear ?... i will explain more if need !
by searching 'javascript randomize array' i found a page about a fisherYates array shuffle algorithm: http://sedition.com/perl/javascript-fy.html
here's the relevant code:
function fisherYates ( myArray ) {
var i = myArray.length;
if ( i == 0 ) return false;
while ( --i ) {
var j = Math.floor( Math.random() * ( i + 1 ) );
var tempi = myArray[i];
var tempj = myArray[j];
myArray[i] = tempj;
myArray[j] = tempi;
}
}
i've made a little example using it: http://www.jsfiddle.net/fftWg/
What comes to randomizing jQuery objects, please have a look at this answer I've given earlier. Maybe it helps otherwise as well — not sure if I really understand what you're after ;) — display galleria list of images in random order
The basic idea is to have a random array and pop from the top of it each time you do 'next' until you run out of array, then repeat.
Get your random number off of the array size. And each time you show an image remove that item from the array. After the array is empty, start over.
you mean something like this: Code:
function RandomSlider()
{
var self = this;
this.pictures = new Array();
this.timeout = 2000; // wait 2000 ms
this.aniTime = "fast" or 1500;
// generate a random number
this.randomStart = function()
{
return Math.floor(Math.random() * self.pictures + 1);
}
this.SetAnimate = function(arrIndex)
{
setTimeout(function()
{
// do animation or what you want
$(....).animate({ .... }, self.aniTime, 'linear', function()
{
// do stuff when you are done with animation
if(arrIndex == self..pictures.length)
{
// when the random index is the last item in your case image 5 and array index 4
// then start over again, start with array index 0
self.SetAnimate(0);
}
else
{
// set the next slider item ready
self.SetAnimate(arrIndex + 1);
}
});
}, self.timeout);
}
this.StartSlider = function()
{
// start animation
this.SetAnimate( this.randomStart() );
}
}
Usage:
/
/ you can put in the array ID's classes attr urls all you want
var picture_array = new Array();
picture_array[0] = "image1";
picture_array[1] = "image2";
picture_array[2] = "image3";
picture_array[3] = "image4";
picture_array[4] = "image5";
var slider = new RandomSlider();
slider.pictures = picture_array;
slider.StartSlider();
精彩评论