`
hewusheng
  • 浏览: 5423 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

跑马灯图片效果

    博客分类:
  • html
 
阅读更多
<div id="demo" style="overflow: hidden; width: 1000px; height: 135px">
    <table cellpadding="0" align="left" border="0" cellspace="0">
<tbody>
<tr>
<td id="demo1" valign="top">
<table cellspacing="2" cellpadding="0" width="160" align="center"  border="0" >
<tr valign="top">
  <td width="156" align="center">
<a href="dxyj/?type=detail&amp;id=13"><img width="235" height="130" src="./dxyj/common/upload/2012/10/25/95139ai.jpg"  /></a></td>
 
  <td width="156" align="center">
<a href="dxyj/?type=detail&amp;id=4"><img width="235" height="130" src="./dxyj/common/upload/2012/10/25/95061o.jpg"  /></a></td>
 
  <td width="156" align="center">
<a href="dxyj/?type=detail&amp;id=3"><img width="235" height="130" src="./dxyj/common/upload/2012/10/25/95926oh.jpg"  /></a></td>
 
  <td width="156" align="center">
<a href="dxyj/?type=detail&amp;id=2"><img width="235" height="130" src="./dxyj/common/upload/2012/10/25/95747hs.jpg"  /></a></td>
 
  <td width="156" align="center">
<a href="dxyj/?type=detail&amp;id=1"><img width="235" height="130" src="./dxyj/common/upload/2012/10/25/95344zn.jpg"  /></a></td>
 
</tr>
</table>
</td>
            <td id="demo2" valign="top"></td>
         </tr>
                              </tbody>
                            </table>
                        </div>
                            <script>
var speed=30
var demo=document.getElementById("demo");
var demo1=document.getElementById("demo1");
var demo2=document.getElementById("demo2");

demo2.innerHTML=demo1.innerHTML
function Marquee2(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar2=setInterval(Marquee2,speed)
demo.onmouseover=function() {clearInterval(MyMar2)}
demo.onmouseout=function() {MyMar2=setInterval(Marquee2,speed)}
              </script>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics