2014-09-02 55 views
1

我有一個貓頭鷹旋轉木馬的一個問題,我在HTML文件中添加以下代碼:貓頭鷹傳送帶不顯示任何

<html> 
<head> 
    <link rel="stylesheet" href="owl-carousel/owl.carousel.css"> 
    <!-- Default Theme --> 
    <link rel="stylesheet" href="owl-carousel/owl.theme.css" 
    <!-- jQuery 1.7+ --> 
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
    <!-- Include js plugin --> 
    <script src="owl-carousel/owl.carousel.js"></script> 
</head> 
<body> 
    <div id="owl-demo" class="owl-carousel owl-theme"> 
     <div class="item"><h1>1</h1></div> 
     <div class="item"><h1>2</h1></div> 
     <div class="item"><h1>3</h1></div> 
     <div class="item"><h1>4</h1></div> 
     <div class="item"><h1>5</h1></div> 
     <div class="item"><h1>6</h1></div> 
     <div class="item"><h1>7</h1></div> 
     <div class="item"><h1>8</h1></div> 
     <div class="item"><h1>9</h1></div> 
     <div class="item"><h1>10</h1></div> 
     <div class="item"><h1>11</h1></div> 
     <div class="item"><h1>12</h1></div> 
    </div> 
</body> 

但導航顯示我在一列中的數字,不格式。我把所有的貓頭鷹旋轉木馬放在正確的文件夾中。問題是哪個?

導航器是谷歌瀏覽器,是最後一個版本。

感謝所有響應

回答

0

呼叫貓頭鷹初始化函數,你的旋轉木馬已準備就緒。

添加以下代碼之前</body>標籤:

<script> 
$(document).ready(function() { 

    $("#owl-demo").owlCarousel(); 

}); 
</script> 

或者:

<script> 
    $(document).ready(function() { 

     var owl = $("#owl-demo"); 

     owl.owlCarousel({ 
      items : 10, //10 items above 1000px browser width 
      itemsDesktop : [1000,5], //5 items between 1000px and 901px 
      itemsDesktopSmall : [900,3], // betweem 900px and 601px 
      itemsTablet: [600,2], //2 items between 600 and 0 
      itemsMobile : false // itemsMobile disabled - inherit from itemsTablet option 
     }); 
    }); 
</script> 
1

簡單的通話OwlCarousel喜歡這個,它會工作。

<script type="text/javascript"> 
jQuery(document).ready(function(){ 
jQuery("#owl-example").owlCarousel(); 
}); 
</script>