`

JS实现间歇无缝文字滚动

阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">

 <style type="text/css">
<!--
*{ margin:0px; padding:0px;}
#box{width:300px; height:24px;overflow:hidden; font-size:12px; background:#efefef;}
#box li{ list-style:none; line-height:24px;}
-->
</style>
<script language="javascript" type="text/javascript">
window.onload=function(){
var o=document.getElementById('box');
window.setInterval(function(){scrollup(o,24,0);},3000);
}
function scrollup(o,d,c){
if(d==c){
var t=getFirstChild(o.firstChild).cloneNode(true);
o.removeChild(getFirstChild(o.firstChild));
o.appendChild(t);
t.style.marginTop="0px";
}else{
c+=2;
getFirstChild(o.firstChild).style.marginTop=-c+"px";
window.setTimeout(function(){scrollup(o,d,c)},20);
}
}
function getFirstChild(node){
while (node.nodeType!=1)
{
node=node.nextSibling;
}
return node;
}
</script>
 
	

 </HEAD>

 <BODY>
  <ul id="box">
<li>· 新华每日电讯:音乐版权收费像“一团麻” </li>
<li>· 现代快报:人类能否和机器人结婚生孩子? </li>
<li>· 环球:美国,一家亿万富翁俱乐部的破产 </li>
<li>· 现代快报:为让媒体封口倪震欲卖李嘉欣情书 </li>
<li>· 京华时报:北京航空航天大学学生自制火箭升天 </li>
</ul> 
 </BODY>
</HTML>

 

分享到:
评论

相关推荐

    jQuery 模仿 Marquee 间歇式 无缝滚动 不间断滚动

    **jQuery 模仿 Marquee 实现间歇式无缝滚动** 在网页设计中,有时我们需要创建一个类似电视新闻滚动条的效果,让文字或图片能够不间断地滚动显示。在HTML5时代,我们可以利用JavaScript库如jQuery来实现这样的效果...

    js文字滚动制作js scroll单排文字滚动向上间歇滚动

    在这个场景中,"js文字滚动制作js scroll单排文字滚动向上间歇滚动"涉及到的是使用JavaScript实现一种常见的网页特效——文字滚动。 文字滚动是一种常见的网页动态效果,它可以使页面上的文本按照设定的方向(如...

    js文字滚动插件制作新闻公告列表scroll文字间歇滚动

    在本场景中,"js文字滚动插件制作新闻公告列表scroll文字间歇滚动"涉及到的核心技术是利用JS实现文字滚动效果,这通常用于展示新闻公告列表,以有限的空间显示更多的内容。以下将详细讲解如何制作这样的插件以及涉及...

    文字间歇向上滚动代码(兼容IE,FF)

    标题“文字间歇向上滚动代码(兼容IE,FF)”表明我们将探讨一个JavaScript实现的解决方案,该方案不仅能在现代浏览器如Firefox中正常工作,而且还能兼容老版本的Internet Explorer(IE)。考虑到IE浏览器曾经的广泛...

    新闻 间歇性向上滚动

    JS间歇性向上滚动 JS间歇性向上滚动 JS间歇性向上滚动 JS间歇性向上滚动 JS间歇性向上滚动

    用CSS+JS实现间歇性滚动

    用CSS+JS实现间歇性滚动,间歇性滚动,添加鼠标事件鼠标悬停时停止滚动。

    js文字滚动插件制作双行关联向上文字间歇滚动

    总的来说,制作一个“js文字滚动插件制作双行关联向上文字间歇滚动”涉及到JavaScript基础、DOM操作、动画处理、浏览器兼容性和插件设计等多个方面。通过深入理解这些知识点,并结合实际项目需求,我们可以构建出一...

    简单实现js间歇或无缝滚动效果

    在本文中,我们将深入探讨如何使用JavaScript实现一个简单的间歇或无缝滚动效果。这个效果可以使内容在页面上连续不断地滚动,创造出一种动态的视觉体验。我们先从HTML、CSS和JavaScript的基本结构开始,然后逐步...

    jquery图片文字滚动插件多组图片文字间歇滚动

    本教程将详细讲解如何利用jQuery实现一个图片与文字的多组间歇滚动插件。 首先,我们需要理解jQuery的核心概念。jQuery提供了一套简洁的API,使得开发者能够更方便地操作DOM(Document Object Model)。例如,`$...

    js文字滚动插件

    在本主题中,我们关注的是"js文字滚动插件",这是一种用JavaScript实现的特效,能够让文本在网页上按照预设的方式自动滚动,如向上或向下间歇滚动,常用于展示新闻公告列表。 制作一个js文字滚动插件,首先要理解...

    原生js间歇文字滚动新浪微博评论文字向下滚动效果

    在本文中,我们将深入探讨如何使用原生JavaScript实现一个类似于新浪微博评论文字向下滚动的效果。这种效果常见于新闻网站、社交媒体平台等,它能为用户提供一种动态的阅读体验,尤其是在显示大量评论时,使得屏幕...

    js 实现的间歇滚动

    3. **CSS动画**:虽然主要使用JavaScript实现滚动,但也可以结合CSS3的`transition`或`animation`属性来增强动画效果,使得滚动更加平滑。 4. **滚动方向**:间歇滚动可以是水平的或垂直的,根据需求调整元素的`top...

    jQuery上下间歇文字滚动.zip

    "jQuery上下间歇文字滚动"就是这样一款优秀的JavaScript特效,它为单排文字提供了一个圆滑、流畅的上下滚动展示方式,无需预先设定容器的高度,极大地提高了灵活性和适用性。下面我们将深入探讨这个特效的实现原理、...

    js+css3文字上下滚动切换动画特效

    "js+css3文字上下滚动切换动画特效"就是一种实现这种效果的技术方案。它结合了JavaScript(js)的编程逻辑与CSS3的新特性,为网页的文字展示带来了生动且富有创意的变化。 首先,我们来了解JavaScript(js)的作用...

    信息无缝滚动和间歇滚动效果.rar

    在提供的源码文件“文字无缝滚动(源代码).html”中,你可以找到以上各种效果的实际应用。通过学习和修改这些示例,你可以根据项目需求定制出适合自己的滚动效果。 总的来说,`&lt;marquee&gt;`标签虽然不是HTML5标准的...

    JS实现的文字间歇循环滚动效果完整示例

    本文实例讲述了JS实现的文字间歇循环滚动效果。分享给大家供大家参考,具体如下: 先来看看运行效果: 具体代码如下: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset=utf-8/&gt; &lt;title&gt;...

    jQuery仿新浪微博图片文字列表间歇上下滚动淡进淡出滚动-20130622

    【jQuery仿新浪微博图片文字列表间歇上下滚动淡进淡出滚动-20130622】这个项目是基于JavaScript库jQuery实现的一种效果,它模拟了新浪微博中图片和文字列表的滚动展示方式,通常用于新闻资讯或者社交媒体的动态展示...

    间歇性循环滚动新闻。从下往上滚动。

    间歇性循环滚动新闻。从下往上滚动。有在线demo

    文字向上间歇滚动

    利用jQuery实现文字间歇向上滚动 很简单的代码 实用也易于修改

Global site tag (gtag.js) - Google Analytics