2017-05-12 45 views
1

此問題已被查詢,每個線程。不幸的是,他們中的任何一個都不適合我的情況。

我試圖讓多張幻燈片的傳送帶,繼這裏codepen:https://codepen.io/anon/pen/OmZppE

我有,在我<head>,下面的鏈接腳本/ CSS

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

所以我假設我已經正確地包含Jquery和Bootstrap(css和js)。然而,當我執行這個腳本

$('.multi-item-carousel').carousel({ 
    interval: false 
}); 

// for every slide in carousel, copy the next slide's item in the slide. 
// Do the same for the next, next item. 
$('.multi-item-carousel .item').each(function(){ 
    var next = $(this).next(); 
    if (!next.length) { 
    next = $(this).siblings(':first'); 
    } 
    next.children(':first-child').clone().appendTo($(this)); 

    if (next.next().length>0) { 
    next.next().children(':first-child').clone().appendTo($(this)); 
    } else { 
    $(this).siblings(':first').children(':first-child').clone().appendTo($(this)); 
    } 
}); 

我與錯誤招呼:「遺漏的類型錯誤:$(...)旋轉木馬是不是一個函數」

的思考?

編輯:忘了實際輪播的html,忽略裏面的erb代碼。無關問題。

<div class="carousel slide multi-item-carousel" id="theCarousel"> 
    <div class="carousel-inner"> 
    <% profile.ventures.each_with_index do |v, index| %> 
    <% if index == 0 %> 
     <div class="item active"> 
    <% else %> 
     <div class="item"> 
    <% end %> 
     <div class="col-xs-4"> 
     <%= link_to v do %> 
      <div class="image-box"> 
       <img src="http://placehold.it/600x450" class="thumbnail img-responsive"> 
        <div class="image-box-caption"> 
         <b> 
         <span class="image-box-text"><%= v.title %></span> 
        </b> 
         </div> 
         <div class="image-box-price"> 
         <b><span class="image-box-text" style="color: white;">From $<%= v.price %></span></b> 
         </div> 
      </div> 
     <% end %> 
     </div> 
     </div> 
    <% end %> 
    </div> 
    <a class="left carousel-control" href="#theCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a> 
    <a class="right carousel-control" href="#theCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a> 
    </div> 
+0

要麼年紀大了jQuery庫問題或跨域問題'https' –

+0

@AlivetoDie我切換到你所提供的鏈接,它並沒有改變,甚至清除緩存。 – Joe

回答

相關問題