Flexslider Start at a random slide and then continue loading sequentially

问题

I am using Flexslider - http://www.woothemes.com/flexslider/ and I have a slider setup with 37 slides in it (yes I know this is ridiculous). I need a way where when the page loads, it randomly picks a slide between slide 1 and slide 37, and then it continues on squentially from there.

For example:

The page loads and it randomly picks slide # 17. The next slide to appear after slide 17 should be 18, then 19, then 20 and so on.

The next time the page loads it randomly picks another slide. Say this time it loads 29. The next slide should be 30, then 31, then 32, etc...

I have the logic figured out so far that I know I need a way to first have Flexslider count the number of slides in the current slider. Then I need to take that number and pick a random number between 1 and X # of slides in the slider.

I found some code on the Flexslider site:

start: function(slider) {
  $('.total-slides').text(slider.count);
},

Which I understands gives you the number of slides, but from here I'm not sure what to do to get a random number to pass to the

startAt: 0,

option.

Here is my current flexslider jquery

    jQuery( document ).ready( function( $ ) {
        $('.flexslider').flexslider({
            animation: "slide",
            useCSS: false,
            controlNav: false,
            slideshow: false,
            start: function(slider) {
                $('.total-slides').text(slider.count); // This gets the number of slides in the slider
              },
              startAt: 0, //This should be a random number
        });
    });

回答1:

Setting a variable with your above code works, you can then call the variable.

$(window).load(function(){

var randomthis = Math.floor((Math.random()* $('.flexslider li').length )+1);

$('.flexslider').flexslider({
  animation: "slide",
  useCSS: false,
  controlNav: false,
  slideshow: false,
  startAt: randomthis

});

});

回答2:

I don't think you want startAt inside the start property. Try this:

$('.flexslider').flexslider({
    ...
    startAt: function() {
        var slideCount = $('.total-slides').text(slider.count);
        var mySlide = Math.floor((Math.random()*slideCount)+1);
        return mySlide;
    }
});

I'm basing this partly off of the API docs and this randomize example.

来源：https://stackoverflow.com/questions/19916612/flexslider-start-at-a-random-slide-and-then-continue-loading-sequentially

标签

jquery

random

flexslider