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>

 

你可能感兴趣的:(无缝滚动)