easySlider 1.7 javascript的Css问题

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; }隐藏所有其他图像

希望这能有所帮助