html5里怎么让图片滚动，html里如何实现图片滚动
来源：整理 编辑：航空兔素材 2023-08-23 01:12:18
1，html里如何实现图片滚动
onm ouseout="this.scrollDelay=1" width="100"> 中间放你的图片，自已再改下marquee属性<p><a href="http://wenwen.soso.com/z/urlalertpage.e?sp=shttp%3a%2f%2fwww.newxing.com%2ftech%2fwebdevelop%2fjavascript%2f53.html" target="_blank">http://www.newxing.com/tech/webdevelop/javascript/53.html</a></p> <p> </p> <p>这里有个实例..你看一下吧</p> <p> 上滚动。。下滚动..左滚动..右滚动都有。</p>
2，用HTML语言怎样使图片连续的从左到右滚动
这里有一个无缝上下左右滚动加定高定宽停顿效果 你把文字改成图片就行里面有源码可以参考<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>图片向左滚动</title><style type="text/css"><!--#demo background: #FFF;overflow:hidden;border: 1px dashed #CCC;width: 900px;}#demo img border: 3px solid #F2F2F2;}#indemo float: left;width: 800%;}#demo1 float: left;}#demo2 float: left;}--></style></head><body><div align=center><div id="demo"><div id="indemo"><div id="demo1"><a href="#" target="_blank"><img src="file:///D|/My Documents/My Pictures/8c7a2834149dcbf4d0a2d3c5.jpg" border="0" width="100" height="125" /></a><a href="#" target="_blank"><img src="file:///D|/My Documents/My Pictures/8c7a2834149dcbf4d0a2d3c5.jpg" border="0" width="100" height="125"/></a><a href="#" target="_blank"><img src="file:///D|/My Documents/My Pictures/8c7a2834149dcbf4d0a2d3c5.jpg" border="0" width="100" height="125"/></a><a href="#" target="_blank"><img src="file:///D|/My Documents/My Pictures/8c7a2834149dcbf4d0a2d3c5.jpg" border="0" width="100" height="125"/></a><a href="#" target="_blank"><img src="file:///D|/My Documents/My Pictures/8c7a2834149dcbf4d0a2d3c5.jpg" border="0" width="100" height="125"/></a></div><div id="demo2"></div></div></div><script><!--var speed=1; //数字越大速度越慢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.offsetWidthelsetab.scrollLeft++;}}var MyMar=setInterval(Marquee,speed);tab.onmouseover=function() tab.onmouseout=function() --></script></div></body></html>图片的大小可以按照你的图片进行设置假如function afunction b那么只有将这两个函数放到一个function c然后鼠标onmouserover事件触发时调用function c{}就可以了<div id=demo style=overflow:hidden;height:400;width:1280;background:#214984;color:#ffffff;border:1px;><table align=left cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top><img src="2.jpg"><img src="2.jpg"><img src="1.jpg"></td><td id=demo2 valign=top></td></tr></table></div><script>var speed=10demo2.innerHTML=demo1.innerHTMLdemo.scrollLeft=demo.scrollWidthfunction Marquee()if(demo.scrollLeft<=0)demo.scrollLeft+=demo2.offsetWidthelsedemo.scrollLeft--}}var MyMar=setInterval(Marquee,speed)demo.onmouseover=function() demo.onmouseout=function() </script> 注意图片大小和div的宽度！
文章TAG：
html5里怎么让图片滚动 html里如何实现图片滚动
