HTML代码
<div id="imgsList" style="height:150px;width:980px;overflow: hidden;"> <div id="marquee_self"> <ul id="marquee_ul"> <li><img src="" width="180px" height="100px">li> <li><img src="" width="180px" height="100px">li> <li><img src="" width="180px" height="100px">li> ul> div> div>
CSS代码
#marquee_self *{ margin: 0; padding: 0; } #marquee_self{ width: 1620px; //所有图片长度个数*width height: 100px; //图片高度 //margin: 100px auto; 居中 background-color: #646464; position: relative; overflow: hidden; } #marquee_self ul{ position:absolute; left:0; top:0; overflow: hidden; //li中超出部分隐藏掉 background-color: #3b7796; //背景色用来看问题 } #marquee_self ul li{ float: left; //左对齐变为图片水平 width: 180px; //图片宽度 height: 100px; //图片高度 list-style: none; //无间隙 }
JS代码