CSS制作滚动图片问题
这个总是滚动为2行,不知道该怎么解决~~`
#marquee ul{
list-style-type:none;
margin:0;
padding:0;
}
#marquee li {
float:left;
width:120px;
height:90px;
margin:2px 2px 2px 0;
border:#999999 solid 1px;
background:#FFFFFF;
padding:1px;
}
#marquee li img{
width:120px;
height:90px;
display:block;
}
<ul style= "width:757px; ">
<marquee scrollamount= "6 " onmouseover= "this.stop(); " onmouseout= "this.start(); " width= "755 " height= "90 ">
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
<li> <img src= "img/header_img.jpg " /> </li>
</marquee>
</ul>
------解决方案--------------------在#marquee ul 里加float:left;试试。
------解决方案--------------------你在 <ul style= "width:757px; "> 里加上id= "marquee "就行了
------解决方案--------------------我就是用IE6测试的,加了id= "marquee "可以了
------解决方案--------------------在IE中,你的img太多,总宽大于marquee时,会导致此结果。
而marquee没有overflow属性,加上个div,设置overflow:hidden;则会导致部分img无法看到
float在不同的浏览器中似乎效果不尽相同……
此问题可以这样改善:(期盼高人)
1、控制img的数量;
2、用2个marquee模拟;