JS实现多张图片纵向横向无缝滚动

2008-09-18 15:26利用JS使用图片或文本横向或纵向无缝滚动,这个效果以前风云一时啊,现在还好,用的人不是很多,估计是因为用户体验不是很好的原因.但是企业站还是用得很多哦,有的老板经常会问:可不可以让我的产品大这个位置滚动呢?我回答时总是:嗯.可以,但是多一段JS,如下:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><a href="http://www.tmxhx.com/default.asp?cateID=6" target="_blank">JS</a>多张图片横向无缝滚动</title>
</head>
<body>
<div id=demo style="overflow:hidden;width:800px;border:2px solid #e0e0e0;padding:2px;" onmouseover="stopscroll();"
onmouseout="doscroll()">
<div id="demo1" style="white-space:nowrap;padding:0;">
<a href="default.asp"><img src="work2007/images/1_222.jpg" height=368 width=256
border=0></a>
<a href="default.asp"><img src="work2007/images/1_222.jpg" height=368 width=256
border=0></a>
</div>
</div>
<!--滚动的javascript-->
<script>
var t=demo.scrollWidth
demo1.innerHTML+=demo1.innerHTML
function doMarquee()
{
demo.scrollLeft=demo.scrollLeft<demo.scrollWidth-demo.offsetWidth?demo.scrollLeft+1:t-demo.offsetWidth
}
function doscroll()
{
   sc=setInterval(doMarquee,20)
}
function stopscroll()
{
   clearInterval(sc)
}
doscroll()
</script>
</body>
</html>
 
posted @ 2010-07-02 19:54  御清风  阅读(4914)  评论(0编辑  收藏  举报