jCarouselLite가 <3 목록과 함께 작동하지 않습니다.

Question

EDIT : jCarouselLite를 사용하려면 SharePoint 공지 목록에서 적절한 마크 업을 만드는 jQuery에 문제가 없습니다. jCarouselLite에서 문제가되는 것 같습니다. jQuery/javascript 변환 코드가 아니라 적절한 마크 업과 함께 다른 jsfiddle을 수행했으며 문제가 여전히 발생합니다.

당신은 다시는 1 또는 2 목록 항목 만 문제가 http://jsfiddle.net/ayatollah/6RKNx/

에서 문제를 볼 수 있습니다. 3+는 잘 작동합니다. 마크 업을 변경해야합니까?이 문제를 해결하기위한 jCarouselLite 호출 코드는 무엇입니까?

바운티는 가능한 한 빨리 제공 될 것입니다!

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

내가 원하는 Sharepoint 사이트에 공지 목록이 있습니다. jCarousel로 변환합니다. Announcement List는 테이블로 렌더링되므로 필요한 jQuery 코드를 조합하여 필요한 ul 구조로 변환했습니다.

jQuery는 그 일을하는 것처럼 보이지만 jCarousel은 이상한 행동을합니다. 첫 번째 발표가해야하는대로 표시되고 두 번째 발표가해야하는대로 스크롤됩니다. 그러나이 후 각 스크롤에 대해 첫 번째 발표가 깜박이고 두 번째 발표가 스크롤됩니다. 그것을 처음부터 다시 스크롤해야 할 때.

제대로 작동했지만 공백 공지가 표시되었으므로 공백 공지 사항을 걸러 내기위한 몇 가지 코드를 소개했습니다. 여기에 문제를 보여줄 jsfiddle이 있습니다.

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

에서 볼 :

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

내가 이전 코드에서 만든 유일한 변화는 추가 부울 값을 추가하는 것이 었습니다 위의 바이올린에, http://jsfiddle.net/RzeEX/3/

그러나이 코드 작품 이전 서버와 정확히 동일하지만, 제 서버에서는 빈 공고가 추가로 표시됩니다. 왜 내가 여기서 그것을 복제 할 수 없는지 모르겠다.

어쨌든 누구든지 아이디어가 있습니까?

편집 : 실제로 2 개 이상의 공지 사항으로 테스트하면 제대로 작동하는 것 같습니다. http://jsfiddle.net/RzeEX/4/

이제 예상대로 작동하지만 2 개의 발표가 있고 여전히 파산 중이며 1 개의 발표가 있고 아무것도 표시되지 않습니다! jCarouselLite 플러그인이 작동한다고 생각하면 jQuery와 관련이 있어야합니다.

단일 발표는 http://jsfiddle.net/RzeEX/5/을 참조하십시오.

Answer 1

:

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

그 방법을이 같은

뭔가 트릭을 할해야 1, 2 또는 100 개의 요소가 있다면 상관 없습니다. 그것은 언제나처럼 작동 할 것입니다.

가 여기에 jsfiddle입니다 : http://jsfiddle.net/XS87c/

Answer 2

내가보기 : 2로 설정하면 원하는 결과를 얻을 수 있다고 생각합니다.

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

작동하지 않는지 알려주세요.

Answer 3

얼마나 많이 보이고 싶습니까? < #가 보이는 경우 어떤 행동을 원하십니까?이 정확한 문제가 발생하여 목록에 < #이 표시되면 carosel을 적용하지 않음으로써 해결했습니다. 당신이 요소의 동적 목록이있을 수 있습니다 나의 이해이기 때문에이 같은 것을 할 수있는,

if ((document.getElementById('viewport') != null) && $('#announcementList').find('li').length >= 3) { 
    $('.viewport').jCarouselLite({ 
     auto: 5000, 
     speed: 1000 
    }); 
} 

Answer 4

이르판의 솔루션을 보완 할 수있다 :

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);  
} 

을 그래서 당신은 당신이 단지 하나 또는 두 개의 볼 또는 두 가지 요소가있는 경우. 그러나 두 개 이상의 요소가있는 경우에는 세 개의 요소 만 표시됩니다.