日期:2014-05-16  浏览次数:20458 次

向左滚动的无间隙JS

?

吾阅:注意,JS脚本必须放在最后,否则不起作用;已经过验证,可使用;

?

<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 1000px;
}
#demo img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>

?

向左滚动
<div id="demo">
<div id="indemo">
<div id="demo1">
<table id="Header1_dlList" cellspacing="0" border="0" style="border-width:0px;border-collapse:collapse;">
?<tr>
??<td>
????????????????????? <a href='ViewNews.aspx?id=42' target="_blank">在存储过程里将不同的参数值组合成不同的</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td><td>
????????????????????? <a href='ViewNews.aspx?id=41' target="_blank">隐藏字段控件的作用是用来存储页面上的值用来向服务器</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td><td>
????????????????????? <a href='ViewNews.aspx?id=40' target="_blank">存储过程里动态生成包含SQL语句字符串</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td><td>
????????????????????? <a href='ViewNews.aspx?id=39' target="_blank">4测试滚动公告2紧贴隔5个字第4行</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td><td>
????????????????????? <a href='ViewNews.aspx?id=38' target="_blank">测试滚动公告2紧贴隔5个字第3行</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td><td>
????????????????????? <a href='ViewNews.aspx?id=37' target="_blank">测试滚动公告2紧贴隔5个字</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td><td>
????????????????????? <a href='ViewNews.aspx?id=36' target="_blank">测试滚动公告</a>&nbsp;&nbsp;&nbsp;&nbsp;
??????????????????? </td>
?</tr>
</table>
</div>
<div id="demo2"></div>
</div>
</div>


<script>?
<!--
var speed=10; //数字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
-->
</script>