兼容所有浏览器的跑马灯

来源:互联网 发布:4g网络打不开苹果商店 编辑:程序博客网 时间:2024/05/15 01:30
<!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>JS实现无间隙滚动代码</title><style type="text/css"><!--#marquee_box {overflow:hidden;width: 390px;}#marquee_box img {border: 3px solid #F2F2F2;}#marquee_img {float: left;width: 800%;}#marquee_img1 {float: left;}#marquee_img2 {float: left;}--></style></head><body><div id="marquee_box"><div id="marquee_img"><div id="marquee_img1"> <a href="#"><img src="images/alipay.gif" /><img src="images/logo.jpg" /></a> </div><div id="marquee_img2"></div></div></div><script language="javascript"><!--var speed = 30; //数字越大速度越慢var tab = document.getElementById("marquee_box");var tab1 = document.getElementById("marquee_img1");var tab2 = document.getElementById("marquee_img2");tab2.innerHTML = tab1.innerHTML;function Marquee() {if (tab2.offsetWidth - tab.scrollLeft <= 0)tab.scrollLeft -= tab1.offsetWidthelse {tab.scrollLeft++;}}var MyMar = setInterval(Marquee, speed);tab.onmouseover = function () { clearInterval(MyMar) };tab.onmouseout = function () { MyMar = setInterval(Marquee, speed) };--></script></body></html>

原创粉丝点击