寻横向图片滚动js代码一段 - ASP及.net - 5D艺术网，我的艺术网！

» 互动论坛 » ASP及.net » 寻横向图片滚动js代码一段

跳转到：

每页显示15条 1/1 << <1 >>

	主题: 寻横向图片滚动js代码一段
liangzn28 职务：普通成员等级：1 金币：0.0 发贴：60 注册：2005/10/14 11:55:43	引用 #12007/2/2 11:59:12 各位大哥，我现想找一段横向图片滚动js代码，效果如www.51mtc.com首页中部的图片横向滚动代码，我想要的是静态非嵌入ＡＳＰ的　js代码，而且是头尾相连的那种，也就是全部图片滚动完了以后紧接着就是第二次滚动．希望各位大哥无私的指教．感激不尽．
dreamexpress_5d 职务：普通成员等级：1 金币：10.0 发贴：2229 注册：2003/7/2 16:32:57	引用 #22007/2/6 8:37:37 实际是html标签marquee就可以邦你解决问题！以下是让三张图片往左连续滚动的代码，试一下吧，你要的是这个吧？ <marquee direction=left onmouseover='stop()' onmouseout='start()' hspace =0 vspace=0 width=100% scrollamount=2 height=80> <table border="0" width="30%"> <tr> <td> <img src="图片１的URL地址"> </td> <td> <img src="图片２的URL地址"> </td> <td> <img src="图片３的URL地址"> </td> </tr> </table> </marquee> 编辑历史:[此帖最近一次被 dreamexpress 编辑过(编辑时间:2007-02-06 10:37:13)]
点来店趣职务：普通成员等级：1 金币：0.0 发贴：2 注册：2007/3/26 19:10:08	引用 #32007/3/26 19:07:20 楼上的对的呀！！
我佛山人职务：版主等级：4 金币：16.0 发贴：2269 注册：2002/8/7 15:09:27	引用 #42007/4/1 23:03:21 <!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=gb2312" /> <title>完美无缝滚动</title> </head> <body> <div id="demo" style="width:270px;height:60px;"> <img src="http://www.5d.cn/bbs/images/logo2.gif" width="270" height="96" /> </div> <div id="demo2" style="width:270px;height:60px;"> <img src="http://www.5d.cn/bbs/images/logo2.gif" width="270" height="96" /> </div> <div id="demo1" style="width:160px;"> <img src="http://www.5d.cn/bbs/images/logo2.gif" width="270" height="96" /> </div> <div id="demo3" style="width:150px;"> <img src="http://www.5d.cn/bbs/images/logo2.gif" width="270" height="96" /> </div> <script type="text/javascript"> <!-- String.prototype.format = function(){ var tmpStr = this; var iLen = arguments.length; for(var i=0;i<iLen;i++){ tmpStr = tmpStr.replace(new RegExp("\\{" + i + "\\}", "g"), arguments[i]); } return tmpStr; } function $() { var elements = new Array(); for (var i = 0; i < arguments.length; i++) { var element = arguments[i]; if (typeof element == 'string') element = document.getElementById(element); if (arguments.length == 1) return element; elements.push(element); } return elements; } function IMarquee(){ function throwError(){alert("接口未实现：" + arguments[0]);} this.Scroll = function(){throwError("Scroll");} this.Clone = function(){throwError("Clone");} } function AbstractMarquee(){ IMarquee.apply(this); var ref = this; var timer = null; var container = null; var indexs = ["ContainerID", "Delay", "Amount", "Width", "Height"]; this.Amount = 1; this.Delay = 30; this.Width = 0; this.Height = 0; this.ContainerID = ""; this.Start = function(){ clearTimer(); timer = setInterval(ref.Scroll, ref.Delay); } this.Stop = function(){ clearTimer(); } this.Pause = function(){ clearTimer(); } this.Init = function(){ container = $(this.ContainerID); if(container == null) {alert("无法找到id为{0}的对象,初始化失败。".format(this.ContainerID));return;}; container.style.overflow = "hidden"; if(this.Width > 0) container.style.width = this.Width + "px"; if(this.Height > 0) container.style.height = this.Height + "px"; this.Clone(); this.AttachEvent(); this.Start(); } this.AttachEvent = function(){ container.onmouseover = ref.Pause; container.onmouseout = ref.Start; } function clearTimer(){ if(timer != null)clearInterval(timer); } function _Marquee(){ var max = Math.min(indexs.length, arguments.length); for(var i=0;i<max;i++) this[indexs[i]] = arguments[i]; } _Marquee.apply(this, arguments); } function MarqueeUp(){ AbstractMarquee.apply(this, arguments); var ref = this; var container = $(this.ContainerID); this.Clone = function(){ container.innerHTML = '<div>{0}</div><div>{0}</div>'.format(container.innerHTML); } this.Scroll = function(){ with(container){ if(scrollTop >= lastChild.offsetTop) scrollTop -= firstChild.offsetHeight; else scrollTop += ref.Amount; } } } function MarqueeDown(){ AbstractMarquee.apply(this, arguments); var ref = this; var container = $(this.ContainerID); this.Clone = function(){ container.innerHTML = '<div>{0}</div><div>{0}</div>'.format(container.innerHTML); container.scrollTop = container.scrollHeight; } this.Scroll = function(){ with(container){ if(scrollTop <= firstChild.offsetTop) scrollTop += lastChild.offsetHeight; else scrollTop -= ref.Amount; } } } function MarqueeLeft(){ AbstractMarquee.apply(this, arguments); var ref = this; var container = $(this.ContainerID); this.Clone = function(){ container.innerHTML = '<table cellspacing="0" cellpadding="0" border="0"><tr><td>{0}</td><td>{0}</td></tr></table>'.format(container.innerHTML); } this.Scroll = function(){ with(container){ if(scrollLeft >= firstChild.rows[0].cells[1].offsetLeft) scrollLeft -= firstChild.rows[0].cells[0].offsetWidth; else scrollLeft += ref.Amount; } } } function MarqueeRight(){ AbstractMarquee.apply(this, arguments); var ref = this; var container = $(this.ContainerID); this.Clone = function(){ container.innerHTML = '<table cellspacing="0" cellpadding="0" border="0"><tr><td>{0}</td><td>{0}</td></tr></table>'.format(container.innerHTML); container.scrollLeft = container.scrollWidth; } this.Scroll = function(){ with(container){ if(scrollLeft <= firstChild.rows[0].cells[0].offsetLeft) scrollLeft += firstChild.rows[0].cells[1].offsetWidth; else scrollLeft -= ref.Amount; } } } var Marquee = { Type : { UP : function(){return new MarqueeUp(arguments[0]);}, DOWN : function(){return new MarqueeDown(arguments[0]);}, LEFT : function(){return new MarqueeLeft(arguments[0]);}, RIGHT : function(){return new MarqueeRight(arguments[0]);} }, newInstance : function(type, container){ return this.Type[type.toUpperCase()].call(this, container); } } var marquee = Marquee.newInstance("Up", "demo"); marquee.Init(); var m1 = Marquee.newInstance("Left", "demo1"); m1.Init(); var m2 = Marquee.newInstance("Down", "demo2"); m2.Init(); var m3 = Marquee.newInstance("Right", "demo3"); m3.Init(); //--> </script> </body> </html> [Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

每页显示15条 1/1 << <1 >>