編輯bootstrap旋轉木馬

Question

我目前正在學習Web開發的繩索，並已開始使用Bootstrap，我目前正在輪播。我不喜歡設計，我發現an alternative carousel

我已經嘗試了很多方法，我已閱讀網站上的指南，但出於某種原因，我無法使其在我的網站上工作。有誰知道我會怎麼去添加插件？

Answer 1

這裏是什麼讓你開始：
http://jsfiddle.net/panchroma/hV3bT/

我從http://www.pixedelic.com/plugins/camera/下載的壓縮包，然後檢查了basic.htm頁面。

如果你看看自舉實例的HTML幾乎是完全一樣的，因爲這下載的示例頁面，除了沒有把內容

<div class="fluid_container"> ... </div> 

我把它等同引導電網

內內

<div class="container"> 
<div class="row-fluid"> 
<div class="span12"> 

<!-- content here --> 

</div> 
</div> 
</div> 

然後我按照它們在basic.html示例中的順序加載CSS和javascript文件。

我認爲唯一的另一件事是，你會發現示例頁面也有一些頭腦風格。可能你唯一需要的是#back_to_camera div。

如果您在本例中需要關於CSS和javascript的更多信息，請轉至jsFiddle並檢查結果窗格的源代碼。您將看到正在使用哪些CSS和JavaScript文件，它們的加載順序以及頭部額外的CSS和JavaScript。

我的例子是缺少一些圖標......箭頭之類的。一旦你安裝了圖像，你的網站上的JavaScript和CSS，我認爲他們應該都很好。

希望這會有所幫助！

編輯：我加入這個額外的CSS迫使縮略圖在第二輪播例子的底部顯示水平

.camera_thumbs_cont ul{ 
width:100% !important; 
} 

.camera_thumbs_cont li 
{ 
display: inline !important; 
padding-right: 20px; 
}