<!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> <body> <div id="demo" style="overflow:hidden;height:215px;"> <div id="demo1"> <a title="" href="#" mce_href="#" target="_blank">aaaa</a><br> <a title="" href="#" mce_href="#" target="_blank">bbbb</a><br> <a title="" href="#" mce_href="#" target="_blank">cccc</a><br> <a title="" href="#" mce_href="#" target="_blank">ddd</a><br> </div> <div id="demo2"></div> </div> <mce:script type="text/javascript"><!-- var speed=50 var demo= document.getElementById("demo"); var demo1 = document.getElementById("demo1"); var demo2 = document.getElementById("demo2"); demo2.innerHTML=demo1.innerHTML function Marquee(){ if(demo.scrollTop>=demo2.offsetHeight) { demo.scrollTop-=demo1.offsetHeight } else{ demo.scrollTop++ } } var MyMar=setInterval(Marquee,speed) demo.onmouseover=function() {clearInterval(MyMar)} demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)} // --></mce:script> </body> </html>
//横向
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>tangfang</title> </head> <body> <div id="demo" style="overflow:hidden;height:120px;width:600px;color:#ffffff"> <table align=left cellpadding=0 border=0><tr><td id="demo1" valign=top> <table border=0 cellpadding=0 cellspacing=0> <tr> <td><img src="http://tangfang9.cn/images/logo.gif" mce_src="http://tangfang9.cn/images/logo.gif" width=150 height=100></td> <td><img src="http://tangfang9.cn/images/logo.gif" mce_src="http://tangfang9.cn/images/logo.gif" width=150 height=100></td> <td><img src="http://tangfang9.cn/images/logo.gif" mce_src="http://tangfang9.cn/images/logo.gif" width=150 height=100></td> <td><img src="http://tangfang9.cn/images/logo.gif" mce_src="http://tangfang9.cn/images/logo.gif" width=150 height=100></td> <td><img src="http://tangfang9.cn/images/logo.gif" mce_src="http://tangfang9.cn/images/logo.gif" width=150 height=100></td> </tr> </table> </td><td id="demo2" valign=top></td></tr></table></div> <mce:script language="javascript"><!-- var LeftMyMar; var MyMar; var speed=30; function MarqueeLeft() { clearInterval(MyMar) demo2.innerHTML=demo1.innerHTML //向左走 function Marquee(){ if(demo2.offsetWidth-demo.scrollLeft<=0) demo.scrollLeft-=demo1.offsetWidth else{ demo.scrollLeft++ } } LeftMyMar=setInterval(Marquee,speed) demo.onmouseover=function() {clearInterval(LeftMyMar)} demo.onmouseout=function() {LeftMyMar=setInterval(Marquee,speed)} } MarqueeLeft(); function MarqueeRight() { clearInterval(LeftMyMar) demo2.innerHTML=demo1.innerHTML demo.scrollLeft=demo.scrollWidth function Marquee(){ if(demo.scrollLeft<=0) demo.scrollLeft+=demo2.offsetWidth else{ demo.scrollLeft-- } } MyMar=setInterval(Marquee,speed) demo.onmouseover=function() {clearInterval(MyMar)} demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)} } // --></mce:script> <a href="#" mce_href="#" onClick="MarqueeLeft()">向左</a> <a href="#" mce_href="#" onClick="MarqueeRight()">向右</a> </body> </html>
您还没有登录,请您登录后再发表评论
js 实现 无缝 滚动 特效 只需该图片名称就行啦
用JS实现图片或文字向上或向下无缝隙滚动
在本项目中,“js无缝隙滚动文字广告”是一种利用JavaScript实现的动态广告展示方式,它能够让文字广告以平滑、连续的方式在页面上滚动,提升用户的视觉体验。当用户点击并按住时,广告会加速向上滚动,增加用户的...
在这个“js图片横向无缝隙滚动+点击按钮加速滚动”的项目中,我们将会探讨如何使用JavaScript来实现这一功能。 首先,无缝隙滚动是通过在视觉上创造一种连续效果,使得用户在浏览一组图片时感觉不到图像之间的切换...
JS不间断向左滚动javascript无缝隙
压缩包内的"超好的横竖同时无缝隙滚动代码.html"文件很可能就是一个示例代码,展示了如何用JavaScript实现上述效果。开发者可以通过查看和学习这个文件,了解具体的实现方法和技巧,从而在自己的项目中应用这些特效...
在jQuery中,实现无缝隙滚动通常涉及到以下几个关键步骤: 1. **选择器(Selectors)**:jQuery提供了丰富的选择器用于选取HTML元素,例如`$("#id")`选取ID为"id"的元素,`$(".class")`选取所有class为"class"的...
javascript简单代码文字从下往上无缝隙滚动,从顶部开始滚动,不会出现空白
以上就是利用JavaScript实现无缝隙横向滚动图片及翻页加速功能的基本思路。在实际开发中,还需要考虑到浏览器兼容性、响应式设计以及性能优化等问题。通过不断迭代和优化,我们可以构建出一个既美观又实用的图片滚动...
**jQuery文字向左无缝隙滚动实现详解** 在网页设计中,跑马灯效果是一种常见的动态展示文本的方式,它能够吸引用户的注意力,使信息传递更为生动。"jQuery文字向左无缝隙滚动"是一种利用jQuery库实现的滚动效果,...
知识点:JS图片左右无缝隙滚动实现 知识点一:兼容性考虑 在介绍的标题中提到“兼容IE,Firefox”,这说明在实现图片左右无缝隙滚动时,需要考虑不同浏览器的兼容性问题。Internet Explorer(IE)和Firefox是两个...
javascript无缝隙 JS不间断向右滚动
jQuery 是一个广泛使用的 JavaScript 库,它简化了DOM操作、事件处理和动画效果,因此用jQuery来实现公告的上下无缝滚动是理想的选择。在本教程中,我们将深入探讨如何使用jQuery实现这个功能。 首先,我们需要在...
JS不间断向上滚动 javascript不间断向上滚动 无缝隙
【标题】"无缝隙图片向上滚动JS代码下载"所涉及的知识点主要集中在JavaScript(JS)编程语言上,尤其是关于图片滚动效果的实现。在网页设计和开发中,为了增加视觉吸引力和用户体验,常会使用JavaScript来创建动态...
MSClass.js API详见下面地址 http://www.popub.net/script/MSClass.html 下面这个不是,推广下网站,嘿嘿www.5t5fa.com
JS不间断向下滚动无缝隙javascript
本文将重点介绍如何使用JavaScript实现marquee的无缝隙循环效果,特别是解决常见的三个问题:不符合W3C标准、代码移植性差以及动态添加图片时的局限性。 #### 二、背景与挑战 ##### 1. HTML不符合W3C的最新标准 ...
无缝滚动通常涉及到JavaScript或者CSS3的运用,有时会结合jQuery等库来简化实现过程。以下是一些关键知识点: 1. **CSS3动画**:CSS3提供了`@keyframes`规则,允许开发者定义一个动画的过程,从开始到结束的各个...
实现不间断无接缝图片滚动,通常需要结合HTML(超文本标记语言)和JavaScript(一种脚本语言)这两种技术。HTML是网页的基础框架,用来定义页面的结构和内容,而JavaScript则负责处理动态交互和功能实现。 1. HTML...
相关推荐
js 实现 无缝 滚动 特效 只需该图片名称就行啦
用JS实现图片或文字向上或向下无缝隙滚动
在本项目中,“js无缝隙滚动文字广告”是一种利用JavaScript实现的动态广告展示方式,它能够让文字广告以平滑、连续的方式在页面上滚动,提升用户的视觉体验。当用户点击并按住时,广告会加速向上滚动,增加用户的...
在这个“js图片横向无缝隙滚动+点击按钮加速滚动”的项目中,我们将会探讨如何使用JavaScript来实现这一功能。 首先,无缝隙滚动是通过在视觉上创造一种连续效果,使得用户在浏览一组图片时感觉不到图像之间的切换...
JS不间断向左滚动javascript无缝隙
压缩包内的"超好的横竖同时无缝隙滚动代码.html"文件很可能就是一个示例代码,展示了如何用JavaScript实现上述效果。开发者可以通过查看和学习这个文件,了解具体的实现方法和技巧,从而在自己的项目中应用这些特效...
在jQuery中,实现无缝隙滚动通常涉及到以下几个关键步骤: 1. **选择器(Selectors)**:jQuery提供了丰富的选择器用于选取HTML元素,例如`$("#id")`选取ID为"id"的元素,`$(".class")`选取所有class为"class"的...
javascript简单代码文字从下往上无缝隙滚动,从顶部开始滚动,不会出现空白
以上就是利用JavaScript实现无缝隙横向滚动图片及翻页加速功能的基本思路。在实际开发中,还需要考虑到浏览器兼容性、响应式设计以及性能优化等问题。通过不断迭代和优化,我们可以构建出一个既美观又实用的图片滚动...
**jQuery文字向左无缝隙滚动实现详解** 在网页设计中,跑马灯效果是一种常见的动态展示文本的方式,它能够吸引用户的注意力,使信息传递更为生动。"jQuery文字向左无缝隙滚动"是一种利用jQuery库实现的滚动效果,...
知识点:JS图片左右无缝隙滚动实现 知识点一:兼容性考虑 在介绍的标题中提到“兼容IE,Firefox”,这说明在实现图片左右无缝隙滚动时,需要考虑不同浏览器的兼容性问题。Internet Explorer(IE)和Firefox是两个...
javascript无缝隙 JS不间断向右滚动
jQuery 是一个广泛使用的 JavaScript 库,它简化了DOM操作、事件处理和动画效果,因此用jQuery来实现公告的上下无缝滚动是理想的选择。在本教程中,我们将深入探讨如何使用jQuery实现这个功能。 首先,我们需要在...
JS不间断向上滚动 javascript不间断向上滚动 无缝隙
【标题】"无缝隙图片向上滚动JS代码下载"所涉及的知识点主要集中在JavaScript(JS)编程语言上,尤其是关于图片滚动效果的实现。在网页设计和开发中,为了增加视觉吸引力和用户体验,常会使用JavaScript来创建动态...
MSClass.js API详见下面地址 http://www.popub.net/script/MSClass.html 下面这个不是,推广下网站,嘿嘿www.5t5fa.com
JS不间断向下滚动无缝隙javascript
本文将重点介绍如何使用JavaScript实现marquee的无缝隙循环效果,特别是解决常见的三个问题:不符合W3C标准、代码移植性差以及动态添加图片时的局限性。 #### 二、背景与挑战 ##### 1. HTML不符合W3C的最新标准 ...
无缝滚动通常涉及到JavaScript或者CSS3的运用,有时会结合jQuery等库来简化实现过程。以下是一些关键知识点: 1. **CSS3动画**:CSS3提供了`@keyframes`规则,允许开发者定义一个动画的过程,从开始到结束的各个...
实现不间断无接缝图片滚动,通常需要结合HTML(超文本标记语言)和JavaScript(一种脚本语言)这两种技术。HTML是网页的基础框架,用来定义页面的结构和内容,而JavaScript则负责处理动态交互和功能实现。 1. HTML...