js无缝滚动原理及其使用注意点

代码：

<style type="text/css">
.jsfc{ width:1000px;  border:1px solid #feab28; height:177px;}
.jsfc .left_pic{width:109px;float:left;}
.marqueeleft{ width:880px; padding:10px 0;overflow:hidden;height:153px; float:left; }
.marqueeleft ul{ width:1880px;height:163px; float:left;}
.marqueeleft li{ width:188px;height:163px; float:left;}
.marqueeleft li div{width:188px;height:138px;}
.marqueeleft li div img{ margin-left:15px;}
.marqueeleft li h1{ font-weight:normal;height:25px; line-height:25px;text-align:center;}
</style>	

<div style="width:8000px;">
 <ul id="marquee1_1">
    <%set DataTable jxhj=get_article_list("pic",50,10,"")%>
   <%foreach(DataRow dr in jxhj.Rows)%>
     <li>
    <div><a href="<%linkurl("pic_show",{dr[id]})%>"><img src="{dr[img_url]}" alt=""  width="166" height="138"/></a></div>
    <h1><a href="<%linkurl("pic_show",{dr[id]})%>">{dr[title]}</a></h1>
    </li>
    <%/foreach%>
</ul>
 <ul id="marquee1_2"></ul>
 </div>

 

其实原理性的东西，知道个差不多就行了，对于现在所有网站都是用div+css来布局的我们来说，复制粘贴代码很容易，但是代码出了问题很难调试，对于这个滚动代码只需要把样式中的marqueeLeft里面的样式overflow:hidden先去掉，检查marquee1_1和marquee1_2的内容是不是都在同一行内，如果在同一行内，那么使用这些代码绝对是正确的。

 

具体原理行的东西可以参考 http://blog.sina.com.cn/s/blog_6387e82401013kx8.html 以下转自这个网页上面的内容

 

刚刚接触JS,网上找了一些关于无缝滚动的教程,但都大同小异,对我这种新手来说也只是会用,不知道什么意思,想要自己写个更是一头雾水.于是找了一些资料,详细说明