2010-02-16 28 views
3

jCarouselLite未在div上設置寬度和左側值。此外,在螢火div和UL是灰色的,雖然該div有:jCarouselLite未在div上設置寬度和左側值

visibility: visible; 

順便說一句,在寬度和高度上的UL和隨後李的屬性被設置爲0不應該被jCarouselLite設置那些?

圖像正在DOM中加載 - 但不顯示。

回答

3

這是由於將包含<div>設置爲display:none的CSS規則引起的。

一旦我刪除它,插件正確計算了值。

1

但是,當頁面中的元素需要在開始時隱藏時該怎麼辦?

我使用了以下技巧來啓動帶有存在元素的頁面,以便插件可以計算它的位置,但超出屏幕的位置,以至於使用者看不到它。

<script type="text/javascript"> 
    $('#myElement').animate({left: '-=5000px'}, 0); 
</script> 

這個技巧還解決了jquery google maps插件的繪圖問題。

也許我的問題在於,我沒有在正確的時間或正確的地方打電話給我的代碼......無論如何,感謝這個好老招,它終於工作了。

1

我最初的容器元素設置爲「display:none」,我用jQuery的slideToggle函數來顯示隱藏的元素。在slideToggle函數調用中,我只需要調用jCarouselLite。這是我怎麼叫它和它的工作確定:

$("#Gallery").slideToggle("slow", function() { 
    if (!carouselLoaded) { 
     $(".carousel").jCarouselLite({ 
      btnNext: ".next", 
      btnPrev: ".prev", 
      circular: true, 
      visible: 1 
     }); 
     carouselLoaded = true; 
    } 
}); 

布爾標誌用於再次裝載容器一旦得到重新隱藏和重新顯示阻止jCarouselLite。

1

在jquery.jcarousellite.js文件修改
div.css(sizeCss, divSize+"px");div.css(sizeCss, "100%");
或要強制設置任何像素。
此外,您可以通過配置來設置想要顯示的號碼項目visible: 5
例如:

 <script type="text/javascript"> 
      $(function() { 
       $(".auto .carousel").jCarouselLite({ 
        auto: 1000, 
        speed: 4000, 
        visible: 5 

       }); 
      }); 
     </script>