的CSS問題與easySlider 1.7的JavaScript

Question

我仍然在幻燈片圖像顯示在所有的瀏覽器顯示的幻燈片區域之外了掙扎：

#slider ul, #slider li, 
     #slider2 ul, #slider2 li{ 
       margin:0; 
       padding:0; 
       list-style:none; 
       } 
     #slider2{margin:0;} 
     #slider li, #slider2 li{ 
       /* 
         define width and height of list item (slide) 
         entire slider area will adjust according to the parameters provided here 
       */ 
       width:680px; 
       height:500px; 
       } 
#slider li img{ 
     float:none; 
} 

     ol#controls{ 
       margin:1em 0; 
       padding:0; 
       height:20px; 
       } 
     ol#controls li{ 
       margin:0 10px 0 0; 
       padding:0; 
       float:left; 
       list-style:none; 
       height:20px; 
       line-height:28px; 
       } 
     ol#controls li a{ 
       float:left; 
       height:20px; 
       line-height:22px; 
       border:1px solid #ccc; 
       background:#FFF; 
       color:#555; 
       padding:0 6px; 
       text-decoration:none; 
       } 
     ol#controls li.current a{ 
       background:#736357; 
       color:#fff; 
       } 
     ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;} 

我不僅改變了寬度和高度，但沒有別的。當然旗幟區域有幻燈片和右鍵。因此，我們將不勝感激。

任何幫助將不勝感激〜！

謝謝。

Answer 1

比如你有一個這樣的滑塊：

<div id="myslider"> 
    <img class="firstSlide" src="../images/img1"/> 
    <img src="../images/img2"/> 
    <img src="../images/img3"/> 
    <img src="../images/img4"/> 
</div> 

與CSS應用你的第一個形象：.firstSlide { display: block }並隱藏所有其它圖像#myslider img { display: none; }

希望這有助於