Пользовательский триггер jCarousel — конец элементов

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

Эти элементы загружаются через 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.


javascript jquery jcarousel jcarousellite
person lorengphd    schedule 29.12.2011    source источник

Ответы (1)


arrow_upward
0
arrow_downward

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

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

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

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

afterEnd: function(){updateConsoles();}
person john    schedule 29.12.2011
comment
Это сработало! Чтобы узнать больше, как вы нашли функцию afterEnd? Это было где-то в скрипте jCarouselLite? Я хотел бы посмотреть, смогу ли я найти его для beforeStart. Таким образом, я могу циклически повторять все элементы списка, чтобы они возвращались к нулю, а затем перезагружали данные. Как и сейчас, данные перезагружаются, пока я смотрю на нижние 4 элемента. - person lorengphd; 30.12.2011
comment
Нашел в документации. Просто надо смотреть посильнее! * option- beforeStart, afterEnd : функция - обратные вызовы * пример * $(.carousel).jCarouselLite({ * btnNext: .next, * btnPrev: .prev, * beforeStart: function(a) { * alert(Перед началом анимации: + a); * }, * afterEnd: function(a) { * alert(После окончания анимации: + a); * } * }); - person lorengphd; 30.12.2011
comment
Есть функция до старта. Просто просмотрите документацию jCarouselLite, чтобы увидеть список вариантов. Рад, что помог :) - person john; 30.12.2011