js 实现图片的不间断滚动中的div width值设置疑点

夏目斑~ 2015-04-29 09:28:16
急急急!!!期待大神火速赶来,<div id="scrolldiv" style=" overflow:hidden; width:1000px; color:#ffffff;">
<table cellspacing="0" cellpadding="0" align="left" border="0" cellspace="0">
<tr>
<td id="td1" valign="top">
<table style="width:1000px; height:89px; border:0;" cellspacing="0" cellpadding="0">
<tr>
<td width="110px" height="89px" background="image/ (1).bmp"></td>
<td width="110px" height="89px" background="image/ (2).bmp"></td>
<td width="110px" height="89px" background="image/ (3).bmp"></td>
<td width="110px" height="89px" background="image/ (4).bmp"></td>
<td width="110px" height="89px" background="image/ (5).bmp"></td>
<td width="110px" height="89px" background="image/ (6).bmp"></td>
<td width="110px" height="89px" background="image/ (7).bmp"></td>
<td width="110px" height="89px" background="image/ (8).bmp"></td>
<td width="110px" height="89px" background="image/ (9).bmp"></td>
<td width="110px" height="89px" background="image/ (10).bmp"></td>
<td width="110px" height="89px" background="image/ (11).bmp"></td>
<td width="110px" height="89px" background="image/ (12).bmp"></td>
</tr>
</table>
</td>
<td id="td2" valign="top"></td>
</tr>
</table>
</div>
<script type="text/javascript">
var n=5;
td2.innerHTML=td1.innerHTML;
var myCheck;
//alert(td2.offsetWidth);
function move(){
if(td2.offsetWidth-scrolldiv.scrollLeft<=0){
//alert("ok");
scrolldiv.scrollLeft=0;
}else{
scrolldiv.scrollLeft++;
}
myCheck=setTimeout(move,n);
}
//alert(scrolldiv);
alert(td1.offsetWidth);
scrolldiv.onmouseover=function(){
clearTimeout(myCheck);
}
scrolldiv.onmouseout=function(){
myCheck=setTimeout(move,n);
}
</script>
其中div width设置成具体的像素值就能实现不间断的滚动,但是像书上写的那样width:100%就只能滚动一会,scrollLeft的最大值只能到667px;然后就不滚动了
...全文
143 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
夏目斑~ 2015-07-10
  • 打赏
  • 举报
回复
哦,原来是这样啊,谢谢
葳蕤自生光 2015-04-29
  • 打赏
  • 举报
回复
这个滚动效果是必须给定图片容器一个具体的width的,如果这里书中给的是100%,那么必然应该还有一个外部容器,给定了具体width。我在项目中用过。

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧