2014-07-07 35 views
0

即時通訊easySlider 1.7實現它的樂趣很簡單,我想做的唯一改變就是將下一個和上一個按鈕移動到滑塊下方,不知道如何完成此任務?我試過把easySlider 1.7如何移動滑塊上方的下一個/上一個控制按鈕?

ol#controls { margin: -30px 0 0 0 !important; } 

在我的css從EasySlider 1.7 - How to move the number buttons on to the image?但沒有運氣。這是我的完整代碼任何建議,將不勝感激。

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="easySlider1.5.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#slider").easySlider(); 
    }); 
</script> 
    <style> 
     body { 
      margin:0; 
      padding:40px; 
      background:#fff; 
      font:80% Arial, Helvetica, sans-serif; 
      color:#555; 
      line-height:180%; 
     } 
     #slider ul, #slider li{ 
      margin:0; 
      padding:0; 
      list-style:none; 
      } 
     #slider li{ 
      width:946px; 
      height:auto; 
      overflow:hidden; 
      } 
     span#prevBtn{} 
     span#nextBtn{} 


    </style> 
</head> 
<body> 

<div id="slider"> 
    <ul>     
     <li><img src="../Desktop/slide1.png" alt="slide1" width="946" height="555" /></li> 
     <li><img src="../Desktop/slide1.png" alt="slide1" width="946" height="555" /></li> 
     <li><img src="../Desktop/slide1.png" alt="slide1" width="946" height="555" /></li> 
     <li><img src="../Desktop/slide1.png" alt="slide1" width="946" height="555" /></li> 
    </ul> 
</div> 

回答

0

添加到您的CSS將調整按鈕的位置

 span#firstBtn { 
      margin-top: -400px; 
      position: absolute; 
      width: auto; 
     } 

這個工程的跨度#firstBtn,跨度#nextBtn,跨度#prevBtn和跨度#lastBtn 。

希望這有助於:)

相關問題