jCarouselLite не работает с <3 элементами списка - PullRequest
Новая
       35

jCarouselLite не работает с <3 элементами списка

3 голосов
/ 08 ноября 2011

РЕДАКТИРОВАТЬ: Это не проблема с jQuery, создающим соответствующую разметку из Списка объявлений SharePoint для использования jCarouselLite.Кажется, это проблема внутри jCarouselLite.Я сделал еще один jsfiddle только с соответствующей разметкой, а не с кодом преобразования jQuery / javascript, и проблема все еще возникает.

Вы можете увидеть проблему на http://jsfiddle.net/ayatollah/6RKNx/

Опять это толькопроблема с 1 или 2 элементами списка.3+ работает отлично.Если бы я изменил разметку, наш код вызова jCarouselLite, чтобы исправить это?

Награда будет предложена, как только она станет доступна!

ORIGINAL ===============================================================================

У меня есть список объявлений на сайте Sharepoint, который я хочу преобразовать в jCarousel.Список объявлений отображается в виде таблицы, поэтому я собрал некоторый код jQuery, чтобы преобразовать его в требуемую структуру ul.

Кажется, что jQuery выполняет свою работу, но jCarousel демонстрирует странное поведение.Первое объявление отображается так, как должно, а затем второе объявление прокручивается как должно.Однако для каждой прокрутки после этого вспыхивает первое объявление, а затем прокручивается второе.Когда он должен был просто прокрутить первое снова.

У меня оно работало правильно, но оно отображало пустые объявления, поэтому я ввел некоторый код для фильтрации пустых объявлений.Вот jsfiddle, чтобы показать вам проблему.

http://jsfiddle.net/RzeEX/2/

Единственное изменение, которое я сделал из предыдущего кода, заключалось в добавлении дополнительного логического значения: 

&& $(listitem).text() != "\xa0"

При просмотре: http://jsfiddle.net/RzeEX/3/

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

В любом случае, у кого-нибудь есть какие-нибудь идеи?

РЕДАКТИРОВАТЬ: На самом деле просто протестировать его с более чем 2 объявлениями, и, кажется, работаетСм. http://jsfiddle.net/RzeEX/4/

Теперь он работает, как и ожидалось, но есть 2 объявления, и он все еще не работает, 1 объявление и ничего не отображается!Это должно быть как-то связано с jQuery, поскольку я считаю, что плагин jCarouselLite работает.

См. http://jsfiddle.net/RzeEX/5/ для одиночного объявления.

Ответы [ 4 ]

6 голосов
/ 10 ноября 2011

Поскольку я понимаю, что у вас может быть динамический список элементов, вы можете сделать что-то вроде этого: 

$('.viewport').jCarouselLite({
    auto:1000,
    speed:1000,
    visible: $('#announcementList li').length
});

Таким образом, не имеет значения, если у вас есть 1, 2 или 100 элементов. Он всегда будет работать как надо.

Вот jsfiddle: http://jsfiddle.net/XS87c/

3 голосов
/ 10 ноября 2011

Я думаю, установив visible: 2 может дать желаемый результат. 

$('.viewport').jCarouselLite({
                    auto:5000,
                    speed:1000,
                    visible:2
              });

дайте мне знать, если это не сработает.

2 голосов
/ 10 ноября 2011

сколько ты хочешь быть видимым?какое поведение вы хотите, если есть <# видимым.Я столкнулся с этой точной проблемой и решил ее, не применяя каросель, если в списке было видно <#. </p>

что-то вроде этого должно сработать: 

if ((document.getElementById('viewport') != null) && $('#announcementList').find('li').length >= 3 ) {
    $('.viewport').jCarouselLite({
        auto: 5000,
        speed: 1000
    });
}
1 голос
/ 10 ноября 2011

В дополнение к решению Irfan, вы можете сделать: 

if(document.getElementById('viewport') != null) {
     var options = {auto:5000,speed:1000}; 
     //Here we count the number of items and set it for a better display for 2 and 1 item
     if($('#viewport a').length <= 2) {
         options.visible = $('#viewport a').length;
     } 
     $('.viewport').jCarouselLite(options);     
}

Так что если у вас есть один или два элемента, вы увидите только один или два.Но если у вас более двух элементов, вы увидите только три элемента.

...