2011-12-29 1 views
1

Я использую jCarousel для отображения списка элементов. Допустим, что есть 8 предметов. Я показываю 4, ожидая 10 секунд, затем прокручиваю, чтобы показать последнее 4. Я бы хотел, чтобы он показал первые четыре, а затем выбросил триггер, который сообщает ему переустановить данные. Элементы обновлялись и продолжали циклироваться следующим образом.Пользовательский jCarousel Trigger - Конец объектов

Эти предметы загружаются через jquery.load [ajax]. Я хочу, чтобы элементы перегруппировались после их показа. Было бы даже лучше, если бы я мог заставить их переустановить после двухчасовой езды. Я переписывал данные с помощью setInterval (основанный на времени), но я бы хотел, чтобы он был динамическим, поэтому мне не нужно менять таймер javascript позже, когда добавляется больше предметов.

Мой код вызова выглядит следующим образом:

$(document).ready(function() { 
     updateConsoles(); 


     $("#tableapp").ajaxStop(function() {     
      scrollwindow(); 
     }); 
    });  

    function updateConsoles() { 
     $('#tableapp').load('AjaxPages/ApplicationMonitor.aspx #application'); 
    }   
    function scrollwindow() { 
     $("#tableapp").jCarouselLite({ 
      vertical: true, 
      hoverPause: true, 
      visible: 4, 
      auto: 6000, 
      speed: 500, 
      scroll: 4 
     }); 
    }; 

В идеале я ищу, чтобы иметь возможность добавить что-то вроде:

function scrollwindow() { 
     $("#tableapp").jCarouselLite({ 
      vertical: true, 
      hoverPause: true, 
      visible: 4, 
      auto: 6000, 
      speed: 500, 
      scroll: 4, 
      whenFinishedCyclingItems: updateConsoles() 
     }); 
    }; 

Я довольно новыми для Javascript и JQuery.

ответ

0

Похоже, jCarouselLite имеет функцию afterEnd.

Таким образом, вы должны быть в состоянии сделать что-то вроде этого:

function scrollwindow() { 
     $("#tableapp").jCarouselLite({ 
      vertical: true, 
      hoverPause: true, 
      visible: 4, 
      auto: 6000, 
      speed: 500, 
      scroll: 4, 
      afterEnd: updateConsoles() 
     }); 
    }; 

Я не уверен, если бы обернуть эту функцию внутри другой функции или нет, но только в том случае, код будет be:

afterEnd: function(){updateConsoles();} 
+0

Это сработало! Для дальнейших знаний, как вы нашли функцию afterEnd? Это где-то в сценарии jCarouselLite? Я хотел бы посмотреть, могу ли я найти его для «beforeStart». Таким образом, я могу перебрать все элементы списка, чтобы они возвращались к нулю. Как и сейчас, данные перезагружаются, когда я смотрю на нижние 4 элемента. – lorengphd

+0

Нашли это в документации. Просто нужно смотреть тяжелее! * опцию- beforeStart, afterEnd:. Функция - обратные вызовы * Пример * $ ("карусельного ") jCarouselLite ({ * btnNext:" .next", * btnPrev: ".prev", * beforeStart: функция (а) { * оповещения ("Перед началом анимации:" + а); *}, * afterEnd: функция (а) { * предупреждение ("После анимации заканчивается:" + а); *} *}); – lorengphd

+0

Есть функция перед запуском. Просто просмотрите документы [jCarouselLite docs] (http://www.gmarwaha.com/jquery/jcarousellite/#doc), чтобы просмотреть список опций. Рад, что помогло :) – john