Skip to content Skip to sidebar Skip to footer

Added A Timer To Animated Collapsible Div

I have used http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm to make this: [link-removed]. I'm trying to find the best way for JavaScript to loop through each of the

Solution 1:

setInterval((function(){
  var count=0;
  returnfunction(){
    var f;
    switch(count++%4) {
      case0: f='one';break;
      case1: f='two';break;
      case2: f='three';break;
      case3: f='four';break;
    }
    animatedcollapse.show(f);
  };
})(),2000);

This works (i injected as is to your code and it scrolls), although could be a whole lot shorter if you gave your img elements numeric id's, like "roller_0", "roller_1", etc. then the whole switch in the middle could be left out...

I should point out that ive wrapped the function in a closure so as to avoid the use of a global variable, although it would work without that as well.

Finally, as to your question about the image being the last one viewed before reset, you can easily rectify that with an onload call to just show arbitrarily the first image, although once you've done this automatic scrolling you might not see that necessary.

Solution 2:

Using jQuery, you could use the trigger() method to "simulate" user interaction. This often helps to avoid duplication. E.g.:

var timer = setInterval(function(){
    var current =  $('.image:visible');
    var next = current.nextAll('.image:first').length ? current.nextAll('.image:first') : $('.image:first');
    next.previous('.header a').trigger('.click');
}, 2000); 

(Not tested.)

Post a Comment for "Added A Timer To Animated Collapsible Div"