製作Nivo滑塊全角

Question

我正在使用Nivo滑塊和Twitter Bootstrap一起使用的項目。我遇到了一個可能無法解決的問題，因爲Nivo可能無法爲其構建。但我試圖將使用span12的當前滑塊轉換爲全寬滑塊。這是可能的，或者我應該只是在尋找一個全寬滑塊來整合？我目前的觀點是。

<div class="slider-wrapper theme-default"> 
<div class="row"> 
    <div class="span12"> 
     <div id="nslider" class="nivoSlider"> 

/* Nivo SLider */ 
.nivoSlider { 
position:relative; 
width:100%; 
height:auto; 
overflow hidden; 
} 
.nivoSlider img { position absolute; top:0px; left:0px; max-width:none; } 
.nivo-main-image { 
display: block !important; 
position: relative !important; 
width: 100% !important; 
} 

Answer 1

如果要製作滑塊全寬，一般方法是將滑塊移到span12，row和container div之外。

從您發佈的代碼，它看起來像你是一個div容器內，如此接近，首先，添加滑塊碼，然後重新打開一個新的div容器的頁面的其餘部分：

</div> <!-- NEW close open container div --> 

<div class="slider-wrapper theme-default"> <!-- open full width slider-wrapper div --> 

<div id="nslider" class="nivoSlider"> 
<!-- slider code --> 
</div> <!-- close nslider --> 

</div> <!-- close slider-wrapper --> 

<div class="container"> 
<!-- continue as normal --> 

根據滑塊代碼和CSS的具體情況，這可能需要一些微調。

祝你好運！