今天我给别的项目组的同事改js代码,跑马灯那种效果刚出来是空白,然后慢慢往上爬,但是要一出来就是内容,然后往上爬那种,弄了办天也不是很好,后来我们组同事回了家在网上给我狂搜代码,终于找到了.我现在把它贴出来和大家一起分享.
<html>
<HEAD>
<TITLE>西邮评估网</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<STYLE type=text/css>
#demo a {
width:100%;
overflow:hidden;
font:12px/16px tahoma;
display:block;
text-decoration:none;
margin:2px;
color:#4a551c;
padding-left:2px;
text-align:left;
}
#demo a:hover {
color:#ff6600;
}
</STYLE>
</HEAD>
<body>
<div id="demo" style="overflow:hidden;height:132px;width:400px; border:1px solid #dde5bc; overflow:hidden;">
<div id=demo1>
<a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a>
<a href="#">代码来自互联网，我只不过稍加整理，希望大家多提意件……</a>
<a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a>
<a href="#">代码来自互联网，我只不过稍加整理，希望大家多提意件……</a>
<a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a>
<a href="#">代码来自互联网，我只不过稍加整理，希望大家多提意件……</a>
<a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a>
<a href="#">代码来自互联网，我只不过稍加整理，希望大家多提意件……</a>
<a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a>
<a href="#">代码来自互联网，我只不过稍加整理，希望大家多提意件……</a>
<a href="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a>
<a href="#">代码来自互联网，我只不过稍加整理，希望大家多提意件……</a>
</div>
<div id=demo2></div>
</div>
<script>
var speed=40
var demo=document.getElementById("demo");
var demo2=document.getElementById("demo2");
var demo1=document.getElementById("demo1");
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
</body>
</html>
分享到：
相关推荐
通过以上步骤，我们可以实现RecyclerView的上下自动无限滚动和跑马灯效果。在实际开发中，可能还需要根据项目的具体需求进行调整和优化，如添加过渡动画、处理边界情况等。在提供的压缩包文件中，很可能是包含了一个...
本文将详细讲解如何使用jQuery实现一个文字向上滚动的跑马灯效果。该效果能够使页面上的文本信息如公告或提示信息动态地连续滚动显示，给用户一种活跃的视觉感受。 ### 知识点一：HTML结构设计 实现跑马灯效果首先...
跑马灯效果能够在一个固定的空间内循环显示大量的信息，增加了视觉吸引力，且节省了屏幕空间。 实现这种效果的关键在于理解Delphi中的两个主要概念：TScrollBox组件和自定义滚动事件处理。TScrollBox是VCL（Visual ...
在Android应用开发中，我们经常会遇到需要展示滚动文字的需求，比如新闻标题的跑马灯效果。在这种场景下，`VerticalMarqueeView`控件就能派上用场。它是一种特殊的视图，允许文本或图像在垂直方向上持续滚动，营造出...
在IT行业中，"跑马灯文字滚动"是一种常见的视觉效果，尤其在电子显示屏、网站、APP界面设计中经常被用到。它通过让文字或信息像霓虹灯一样连续滚动，来展示大量的信息或者吸引用户的注意力。这个效果通常用于有限的...
本文将深入探讨如何在C#中实现跑马灯效果，特别是滚动文字的实现。 首先，我们需要了解C#中实现滚动文字的基本元素。这通常涉及到Windows Forms或WPF框架中的控件。在Windows Forms中，我们可以使用`Label`控件配合...
在网页设计中，跑马灯效果是一种常见的动态展示方式，常用于新闻滚动、公告提示或者活动展示等场景。跑马灯能吸引用户的注意力并高效地传递信息。在本例中，我们将探讨如何使用jQuery实现一个文字向上跑动的跑马灯...
前端JavaScript接收到这些数据后，再使用类似上述`cls_marquee`函数的代码，将动态内容插入到跑马灯效果中进行展示。 ### 总结 综上所述，虽然“js跑马灯代码php”这个标题和描述看似将JavaScript和PHP关联在一起...
### HTML跑马灯效果详解 ... ... #### 二、`<marquee>`标签属性详解 1. **`scrollAmount`**：定义了跑马灯滚动的速度。...- 对于需要更复杂效果的情况，可以考虑使用CSS3动画或者JavaScript库来实现更高级的跑马灯效果。
4. **文字滚动**：对于文字滚动，你可以使用`TextView`的`marqueeRepeatLimit`属性来开启跑马灯效果。同时，可以设置`ellipsize`属性来控制超出屏幕范围的文字处理方式。 5. **动画效果**：为了模拟淘宝广告条的...
HTML 和 JSP 中的滚动字幕，也称为跑马灯效果，是一种常见的动态网页元素，用于展示滚动或循环播放的文字信息。在 HTML5 中，`<marquee>` 标签被用于创建这种效果，虽然在现代网页开发中，由于其非标准特性，使用较...
实现Android垂直跑马灯效果主要涉及以下几个关键知识点： 1. **自定义View**：由于Android原生组件并未提供垂直跑马灯的功能，开发者需要自定义一个View来实现这一效果。这通常涉及到继承自`View`或`TextView`类，...
在现代网页设计中，跑马灯效果是一种常见的动态文本展示方式，用于吸引用户的注意力，特别是在新闻网站、广告页面和其它需要突出文本内容的场合。Vue.js是一个流行的前端JavaScript框架，它提供了一种简单的方式来...
"liMarquee跑马灯插件"是一种常用于网页设计中的动态效果工具，它能够创建出类似跑马灯的滚动文字或图片展示效果，给网页增添动态美感和吸引力。跑马灯效果通常指的是内容沿固定方向（如左右、上下）连续滚动，类似...
这种视觉呈现方式被称为“跑马灯”效果或“滚动条”效果，是UI设计中的一个重要元素，可以有效地节省屏幕空间并吸引用户的注意力。 实现这种效果的方法多种多样，但通常涉及到编程语言如JavaScript、CSS以及HTML的...
"JQuery 图片不断向上翻滚代码"就是一种实现这种动态效果的技术，它可以让图片以滚动的形式不间断地向上移动，创造出类似跑马灯或者新闻滚动的效果。这种效果常用于网站的头条新闻展示、广告轮播或产品展示等场景，...
通过使用这个插件，开发者可以在网页上创建一个类似于跑马灯的效果，使得信息自动上下滚动，从而增强页面的视觉动态效果和用户体验。 在本文中，将介绍如何使用vticker.js结合jQuery来实现页面动态数据的滚动效果。...
左右移动转换文字特效，通常被称为跑马灯效果，是一种常见的网页元素，用于在网页上实现文字左右移动的视觉效果。尽管目前有更为现代化和功能丰富的JavaScript库和框架能够实现更多样和动态的效果，但跑马灯效果仍然...