如何移動引導列？

我正在使用引導，我需要移動列。我的頁面由4列fullpage height（col-md-3）組成;我也使用Fullpage.js。我希望當用戶滾動到包含列的部分時，用戶看不到列，但這些列從右側（屏幕外）出現在左側並填充頁面。如何移動引導列？

這是列的代碼

<div class="section" id="section1" style="margin:0px; padding:0px; margin:0px; padding:0px;"> 
     <div id="slogan" style="width:100%; text-align:center"> 
      <img src="images/slogan.png" style="width:50%; min-width: 530px;" /> 
     </div> 
     <div style="width:100%"> 
      <div id="aa" class="col-lg-3 col-md-3 col-sm-3 col-xs-3" style="margin:0px; padding:0px; text-align:center; background-color:#FFF5E9;"> 
       <img src="images/aa.png" style="width:60%;" /> 
       <img src="images/bb.png" style="width:60%;" /> 
       <a class="hidden-xs scroll" href="../Home.html#secondPage" style="margin:0px; padding:0px; margin-left:-40px; top:-35px;"></a> 
      </div> 

      <div id="cc" class="col-lg-3 col-md-3 col-sm-3 col-xs-3" style="margin:0px; padding:0px; text-align:center; background-color:#e3d4c1;"> 
       <img src="images/cc.png" style="width:60%" /> 
       <img src="images/vv.png" style="width:60%;" /> 
       <a class="hidden-xs scroll" href="../Home.html#secondPage" style="margin:0px; padding:0px; margin-left:-40px; top:-35px;"></a> 
      </div> 

      <div id="dd" class="col-lg-3 col-md-3 col-sm-3 col-xs-3" style="margin:0px; padding:0px; text-align:center; background-color:#FFF5E9;"> 
       <img src="images/gg.png" style="width:60%;" /> 
       <img src="images/hh.png" style="width:60%;" /> 
       <a class="hidden-xs scroll" href="../Home.html#secondPage" style="margin:0px; padding:0px; margin-left:-40px; top:-35px;"></a> 
      </div> 

      <div id="rr" class="col-lg-3 col-md-3 col-sm-3 col-xs-3" style="margin:0px; padding:0px; text-align:center; background-color:#e3d4c1;"> 
       <img src="images/rr.png" style="width:60%;" /> 
       <img src="images/yy.png" style="width:60%;" /> 
       <a class="hidden-xs scroll" href="../Home.html#secondPage"  style="margin:0px; padding:0px; margin-left:-40px; top:-35px;"></a> 
      </div> 
     </div>

現在列是可見的，但我想從正確的到達（出屏）。

謝謝！

來源

2015-04-03 dev_simox

告訴我們您的代碼.... – Yash 2015-04-03 10:17:42

是一個談論的是一個旋轉木馬？ – 2015-04-03 10:17:48

我添加了代碼 – 2015-04-03 11:57:05

我想你想要一個特定部分的內容動畫。

在這種情況下，您可以使用很多插件，只需使用Google搜索。

我發現一個也許可以讓你滿意：http://git.blivesta.com/animsition/

的說明是很簡單的。如果您有任何問題，請告訴我。

否則，你可以同時選中已經回答了類似的問題：Animate bootstrap columns

來源

2015-04-03 13:08:32

如何移動引導列？

回答

相關問題