Добавлен таймер для Animated Collapsible DIV

Question

Я использовал http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm, чтобы сделать это: [ссылка удалена].

Я пытаюсь найти лучший способ для JavaScript перебрать каждое из четырех меню непрерывным циклом без какого-либо взаимодействия с пользователем, но не могу придумать, как это сделать!

Также одна ошибка, которую я не могу устранить: она запоминает, в каком меню вы были, но фоновое изображение всегда из последнего меню при загрузке страницы.

Спасибо!

Answer 1

setInterval((function(){
  var count=0;
  return function(){
    var f;
    switch(count++%4) {
      case 0: f='one';break;
      case 1: f='two';break;
      case 2: f='three';break;
      case 3: f='four';break;
    }
    animatedcollapse.show(f);
  };
})(),2000);

Это работает (я вставил как есть ваш код, и он прокручивается), хотя может быть намного короче, если вы дадите числовому идентификатору элементов img, например, "roller_0", "roller_1" и т. Д., Тогда весь переключатель середина может быть опущена ...

Я должен отметить, что ive обернул функцию в замыкание, чтобы избежать использования глобальной переменной, хотя она бы работала и без этого.

Наконец, что касается вашего вопроса об изображении, которое было последним просмотренным перед сбросом, вы можете легко исправить это с помощью вызова onload, чтобы просто произвольно показать первое изображение, хотя после того, как вы сделали эту автоматическую прокрутку, вы можете не увидеть что необходимо.

Answer 2

Используя jQuery, вы можете использовать метод trigger() для "симуляции" взаимодействия с пользователем. Это часто помогает избежать дублирования. 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); 

(не проверено.)