javascript - How can we increase slides limit to dynamic currently it set for only 3 slide -


i want create same fadein , fadeout effect shown in given below example:

http://www.spicypeanut.net/slideshow/slideshow.html

http://www.spicypeanut.net/blog/jquery%20slideshow.html

but issue - example created 3 slides , want more 3 slides or need dynamically increased.

but how modify script gets maximum amount of slides automatic? if generate slide dynamic within cms example no 1 can maximum number of slides be.. have update *.js everytime hand @ parts :/

if (this.last < 1) {  this.last = 3; }   if ($$.slideshow.counter > 3)  {  $$.slideshow.counter = 1; #  }  

would nice if me (and think many others) @ point :)

below js used in example:

var $$ = $.fn;  $$.extend({   splitid : function()   {     return this.attr('id').split('-').pop();   },    slideshow : {     ready : function()     {       $('div.tmpslideshowcontrol')         .hover(           function() {             $(this).addclass('tmpslideshowcontrolon');           },           function() {             $(this).removeclass('tmpslideshowcontrolon');           }         )         .click(           function() {             $('div.tmpslide').hide();             $('div.tmpslideshowcontrol').removeclass('tmpslideshowcontrolactive');              $('div#tmpslide-' + $(this).splitid()).show()             $(this).addclass('tmpslideshowcontrolactive');           }         );        this.counter = 1;        this.transition();     },      transition : function()     {       if (this.interrupted) {         return;       }        this.last = this.counter - 1;        if (this.last < 1) {         this.last = 3;       }        $('div#tmpslide-' + this.last).fadeout(         'slow',         function() {           $('div#tmpslideshowcontrol-' + $$.slideshow.last).removeclass('tmpslideshowcontrolactive');           $('div#tmpslideshowcontrol-' + $$.slideshow.counter).addclass('tmpslideshowcontrolactive');           $('div#tmpslide-' + $$.slideshow.counter).fadein('slow');            $$.slideshow.counter++;            if ($$.slideshow.counter > 3) {             $$.slideshow.counter = 1;           }            settimeout('$$.slideshow.transition();', 5000);         }       );     }   } });  $(document).ready(   function() {     $$.slideshow.ready();   } ); 

even have done r&d , found 1 more amazing issue :

when increased last vale 3 5 showing problem in navigation controls - if slide on 4 if clicked on 2 navigation moving on previous track mean move 5 instead of 3.

so please if can me out in this.

instead of setting static value number of slides, use jquery fetch number of slides instead, .length:

// number of slides var slidecount = $("#tmpslideshow > .tmpslide").length;  if (this.last < 1) {      this.last = slidecount; }   if ($$.slideshow.counter > slidecount) {      $$.slideshow.counter = 1; } 

Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -