BX Slider在Bigcartel站點中不工作

Question

我無法弄清楚我在做一個Big Cartel主題頁上的BXSlider時出現了什麼問題。我加入的CSS來我的樣式表，這裏是我的代碼...

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script> 

<script src="https://code.google.com/p/bxslider/"></script> 

<script type="text/javascript"> 
$(document).ready(function(){ 
$('.bxslider').bxSlider(); 
}); 
</script> 

</head> 

什麼是身體...

<div class="bx-wrapper" style="max-width: 100%;"> 
    <div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 220px;"> 

    <ul class="bxslider" style="width: auto; position: relative;"> 
    <li><img src='http://i1338.photobucket.com/albums/o690/robertalsogarrett/IMG_9821_zps67c74096.jpg'></li> 
    <li> <img src='http://i1338.photobucket.com/albums/o690/robertalsogarrett/IMG_9907_zps2d37fd53.jpg'></li> 
    <li><img src='http://i1338.photobucket.com/albums/o690/robertalsogarrett/IMG_9868_zpsa180b062.jpg' ></li> 
    </ul></div> 

    <div class="bx-controls bx-has-pager bx-has-controls-direction"> 
     <div class="bx-pager bx-default-pager"> 
     <div class="bx-pager-item"><a href="" data-slide-index="0" class="bx-pager-link active">1</a></div> 
     <div class="bx-pager-item"><a href="" data-slide-index="1" class="bx-pager-link">2</a></div> 
     <div class="bx-pager-item"><a href="" data-slide-index="2" class="bx-pager-link">3</a></div></div> 
     <div class="bx-controls-direction"><a class="bx-prev" href="">Prev</a><a class="bx-next" href="">Next</a></div> 
    </div> 
</div> 

Answer 1

首先，你實際上並沒有包括bxslider腳本。您應該下載源代碼並在bxslider site上推薦本地服務。除此之外，你還包括兩個版本的jQuery，不太好。

<!-- jQuery library (served from Google) --> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

<!-- bxSlider Javascript file --> 
<script src="/js/jquery.bxslider.min.js"></script> 

<!-- bxSlider CSS file --> 
<link href="/lib/jquery.bxslider.css" rel="stylesheet" /> 

我不知道你正在使用的bxslider的版本，但如果可能的話，你可能要考慮升級到最新版本。

附加提示，內置在開發人員工具中的瀏覽器將爲您節省大量時間。你應該對他們很舒服。

這是一個example plunkr，可能會幫助你去。