<div id="stable_2">
<TABLE border=0 cellSpacing=0 cellPadding=0 width="100%" >
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">1.连续无缝向上滚动</A></TD>
</TR>
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">2.连续无缝向上滚动</A></TD>
</TR>
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">3.连续无缝向上滚动</A></TD>
</TR>
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">4.连续无缝向上滚动</A></TD>
</TR>
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">5.连续无缝向上滚动</A></TD>
</TR>
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">6.连续无缝向上滚动</A></TD>
</TR>
<TR>
<TD height="20" colspan="3"><A href="
http://blog.csdn.net/vince6799">7.连续无缝向上滚动---结束</A></TD>
</TR>
</TABLE>
</div>
<script type="text/javascript">
function addEventSimple(obj,evt,fn)
{
if(obj.addEventListener)
{
obj.addEventListener(evt,fn,false);
}else if(obj.attachEvent)
{
obj.attachEvent('on'+evt,fn);
}
}
addEventSimple(window,'load',initScrolling);//保存想要滚动的容器
var scrollingBox;var scrollingInterval;//用于记录是否“滚到头”过一次
var reachedBottom=false;//记录第一次滚到头时候的scrollTopvar bottom;//初始化滚动效果
function initScrolling()
{
scrollingBox = document.getElementById("stable_2");//样式设置,与滚动基本无关,应该用CSS设置。
scrollingBox.style.height = "150px";
scrollingBox.style.overflow = "hidden";//滚动
scrollingInterval = setInterval("scrolling()",50);//鼠标划过停止滚动效果
scrollingBox.onmouseover = over;//鼠标划出回复滚动效果
scrollingBox.onmouseout = out;
}//滚动效果
function scrolling()
{//开始滚动,origin是原来scrollTop
var origin = scrollingBox.scrollTop++;//如果到头了
if(origin == scrollingBox.scrollTop)
{//如果是第一次到头
if(!reachedBottom)
{
scrollingBox.innerHTML+=scrollingBox.innerHTML;
reachedBottom=true;
bottom=origin;
}else{//已经到头过,只需回复头接尾的效果
scrollingBox.scrollTop=bottom;
}
}
}
function over()
{
clearInterval(scrollingInterval);
}
function out()
{
scrollingInterval = setInterval("scrolling()",50);
}
</script>
相关推荐
### 图片连续循环滚动代码原理 #### 基本思路 该代码的核心思想是利用JavaScript定时器来控制图片的滚动速度,通过不断调整图片容器(即`div`元素)的滚动位置来实现滚动效果。具体来说,是通过动态改变容器的`...
标题中的"成批图片单个依次向上循环滚动"暗示了一个涉及到图像处理和动态展示的技术问题。这可能是关于如何在某种应用程序或网页中实现一个图片轮播效果,其中图片会逐个按照设定的方向(向上)进行循环滚动。这种...
5. 循环滚动:当ul元素滚动到最左边时,需要将其位置调整到原始位置,并且继续执行滚动,这样才能实现真正的循环滚动效果。这可以通过判断ul元素的左边界是否已经超出了容器的左边界来实现。如果超出,则将ul元素的...
【标题】"无缝隙图片向上滚动JS代码下载"所涉及的知识点主要集中在JavaScript(JS)编程语言上,尤其是关于图片滚动效果的实现。在网页设计和开发中,为了增加视觉吸引力和用户体验,常会使用JavaScript来创建动态...
在探讨“js实现图片的无缝循环滚动”这一主题时,我们深入分析了通过JavaScript和HTML实现图片无缝滚动的技术细节,包括向上、向下以及向右滚动的实现方式。下面,我们将详细解析这一技术的关键知识点。 ### 图片...
【Div块上下左右循环滚动】是一种常见的网页动态效果,它可以使网页中的某个Div元素实现持续不断的循环滚动,增强用户体验和视觉吸引力。这种效果通常通过JavaScript和CSS技术来实现,尤其在现代网页设计中,...
jQuery文字逐行向上滚动代码是一种常见的网页动态效果,它能够使文本内容以逐行上升的方式展示,常用于新闻更新、公告栏或者滚动广告等场景,为网页增添动态视觉效果,吸引用户注意力。在这个"jQuery文字逐行向上...
根据给定的信息,本文将详细解释“图片向上滚动”这一网页特效的相关知识点,包括其实现原理、HTML与JavaScript代码分析及应用。 ### 实现原理 “图片向上滚动”的特效是通过在网页上创建一个固定高度的容器,并在...
- **复制内容**:为了达到循环滚动的效果,需要复制一份相同的内容放置于容器内。 - **设置样式**:通过CSS设定容器的尺寸、溢出隐藏属性等,确保只显示一部分内容。 - **控制滚动**:使用JavaScript定时调整容器的...
2. **`AutoPlay()`**:该函数用于设置自动向下滚动的定时器,每隔2000毫秒调用一次`ISL_GoDown()`函数并随后执行`ISL_StopDown()`函数,实现循环滚动的效果。 3. **`ISL_GoUp()`与`ISL_GoDown()`**:分别用于启动...
在网页设计中,"无缝向上滚动(图片文字效果)"是一种流行且吸引用户注意力的动态展示方式。这种技术主要用于创建连续、平滑的滚动动画,让图像和文字以优雅的方式在页面上移动,从而增强用户体验并提升网站的视觉...
标题中的“多列文字循环滚动带停顿”指的是在网页设计中实现的一种特效,它允许文字信息以多列的形式在页面上循环滚动,并且在滚动过程中有停顿效果,这样可以吸引用户的注意力并方便阅读。这种效果常用于网站公告、...
无缝向上滚动文字代码,正如其名,旨在实现一种在页面上连续、平滑且无中断的文字滚动效果,而且这种效果应该能在各种浏览器上正常工作,包括但不限于Chrome、Firefox、Safari、Edge以及Internet Explorer等。...
标题“文字间歇向上滚动代码(兼容IE,FF)”表明我们将探讨一个JavaScript实现的解决方案,该方案不仅能在现代浏览器如Firefox中正常工作,而且还能兼容老版本的Internet Explorer(IE)。考虑到IE浏览器曾经的广泛...
【标题】"jQuery实现的向上无缝循环滚动新闻效果"是一种常见的网页动态展示技术,它能够为网站增添生动性,吸引用户的注意力。这种效果通常应用于新闻网站的头条区、滚动公告栏或者产品展示区域,使得信息能够以连续...
4. **无缝滚动**:在动画结束时,利用jQuery的回调函数,将第一张图片移动到序列的末尾,使用户感觉图片一直在循环滚动,没有尽头。 5. **方向控制**:为了提供前进和后退的控制,可以添加两个按钮,分别处理图片向...
【标签】"JS特效-滚动代码"指明了实现这种功能主要依赖JavaScript编程语言。JavaScript是一种广泛应用于网页交互的客户端脚本语言,它能够直接在用户浏览器上运行,无需服务器支持。通过JavaScript,开发者可以创建...
### 文字滚动代码详解:`<marquee>` 标签及其属性 在网页设计与开发过程中,有时我们需要实现一些简单的动态效果,例如滚动的文字或图片等。这些效果可以通过使用 HTML 的 `<marquee>` 标签来轻松实现。下面将详细...
标签"JS特效-滚动代码"表明这个压缩包可能包含了实现上述滚动效果的代码示例。通常,这些示例代码会包含HTML结构、CSS样式以及JavaScript逻辑,以便用户可以直接在自己的项目中复用或作为学习参考。文件名称列表没有...
### 文字滚动代码教程知识点详解 #### 一、引言 在网页设计中,动态效果能够有效提升用户体验,增加页面的吸引力。其中,文字滚动是一种常见的动态效果,它可以通过简单的HTML标签实现。本文将详细介绍如何利用`...