<!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=utf-8" />
<title> new document </title>
<style type="text/css">
#scroll {margin:0;padding:2px 0;list-style:none;border:1px solid red;width:600px;height:18px;overflow:hidden}
#scroll li {margin:0;padding:0 4px;font-size:12px;height:18px;line-height:18px;width:600px;}
</style>
<script type="text/javascript">
window.onload = function() {
dMarquee('scroll');
}
function dMarquee(id){
var speed=20; //速度
var stop=1000; //停止时间
var ul = document.getElementById(id);//获取ul元素
var rows=ul.getElementsByTagName('li').length;//获取li个数
var height = ul.getElementsByTagName('li')[0].offsetHeight;//取得第一个li的高度
ul.innerHTML += ul.innerHTML;//获取所有li
var timeID = false;//settime的时间标示
//移动方法
var play = function() {
ul.scrollTop++;//移动滚动条
//移动到底的时候恢复为零
if(ul.scrollTop==rows*height){
ul.scrollTop=0;
}
//每次滚动
if(ul.scrollTop%height==0) {
timeID = setTimeout(play,stop);
}else{
timeID = setTimeout(play,speed);
}
}
timeID = setTimeout(play,stop);
ul.onmouseover = function() {clearTimeout(timeID);}
ul.onmouseout = play;
}
</script>
</head>
<body>
<embed src="http://player.youku.com/player.php/sid/XMTY3MDMyMzg4/v.swf" quality="high" width="480" height="400" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash"></embed>
<ul id="scroll">
<li>.莫比初级教学班开课了 .秋季班现在要开课了快来参加吧 .就这样的开始了</li>
<li><a href="">.莫比初级教学班开课了</a> .秋季班现在要开课了快来参加吧 .就这样的开始了</li>
<li>.莫比初级教学班开课了 <a href="">.秋季班现在要开课了快来参加吧</a> .就这样的开始了</li>
<li>.莫比初级教学班开课了 .秋季班现在要开课了快来参加吧 .就这样的开始了</li>
</ul>
</body>
</html>
分享到：
相关推荐
jQuery 实现文字上下滚动
总的来说，"js+css3文字上下滚动切换动画特效"是一个结合了前端两种核心技术的实践案例，展示了如何通过JavaScript的动态控制与CSS3的动画效果，创造出引人注目的网页交互体验。无论是用于网站标题、通知栏还是其他...
标题中的“一个jQuery广告文字上下滚动效果”是指利用JavaScript库jQuery实现的一种动态展示文本的特效，常见于网站的广告栏或者新闻滚动条。这种效果可以让文字以上下滚动的方式吸引用户的注意力，增加信息的可见性...
标题和描述提到的"jQuery单行文字上下不间断循环滚动效果"就是一个这样的实例，它主要用于创建一串文字在单一行内循环滚动，通常用于网站的头部或侧边栏，以动态展示最新的新闻标题或公告。 要实现这个效果，首先...
总结，实现JS的Marquee上下滚动效果，关键在于利用JavaScript动态改变元素的位置，配合CSS样式限制可视区域。通过封装成类或函数，我们可以更好地控制和扩展这个功能，使其适应不同项目的需求。"MSClass.js"文件很...
标题中的“jQuery Bootstrap响应式新闻列表文字上下滚动特效”指的是使用jQuery库和Bootstrap框架来创建一个适应不同设备屏幕尺寸的新闻列表，同时实现文字的上下滚动效果。这种特效常见于网站的新闻或更新部分，...
### JS上下文字滚动效果知识点详解 #### 一、概述 在网页设计中，为了增加页面的动态效果，提升用户体验，常常会使用JavaScript来实现各种特效，其中“上下文字滚动效果”是非常常见的一种。这种效果通常用于展示...
网上找到很多文字滚动，但都良莠不齐，基本都是左右滚动的，没有上下滚动。所以来分享一波 利用scortop实现文字移动，判断如果第一个元素的高度，如果小于等于了scrolltop（翻滚了多少高度）就把它删除并且添加到...
《CSS3文字上下滚动切换特效详解》 在网页设计中，动态效果的运用能极大地提升用户体验，其中文字滚动切换特效就是一个常见的元素。本篇文章将详细解析"css3文字上下滚动切换特效"，并探讨如何利用jQuery和CSS3实现...
在Android应用开发中，"首页通知上下滚动效果"是一种常见的用户界面（UI）设计，用于展示重要的、实时更新的通知信息。这种效果使得用户无需离开主页面就能获取到新消息，提高了用户体验。本篇将深入探讨如何实现...
在探讨“js文字间隔滚动上下滚动”的知识点时，我们深入分析了如何利用JavaScript结合jQuery库实现文本元素的动态上下滚动效果。这一技术在网站设计、新闻滚动条、公告栏等场景中极为常见，能有效提升用户体验，使得...
总的来说，jQuery文字上下滚动是一种利用jQuery库实现动态文本显示的技术，它可以通过调整CSS属性和使用`animate()`函数来创建流畅的滚动效果。结合适当的HTML结构和CSS样式，可以为网站增添动态的视觉吸引力。
标题中的“上下滚动效果”指的是在网页设计中，利用JavaScript（jQuery）和CSS技术实现的一种动态展示文本或内容的方式。这种效果通常用于新闻滚动、公告滚动等场景，使得信息能够在一个固定区域里循环滚动，既节省...
总结来说，实现兼容多种浏览器的公告栏文字滚动效果主要涉及JavaScript DOM操作、CSS动画以及浏览器兼容性处理。理解这些基础知识，结合实际的“MarqueeTop.html”文件，可以帮助开发者创建出更高效、更灵活的滚动...
7. **js**：这个目录可能包含了所有必要的JavaScript文件，包括jQuery库本身以及实现文字滚动效果的自定义脚本。 在实现jQuery文字向上滚动时，主要涉及的技术点可能包括： 1. **DOM操作**：jQuery提供了一系列方便...
在本文中，我们将深入探讨如何使用jQuery来实现一个按钮控制的文字上下滚动效果，这是一个常见的JavaScript特效，常用于网站中的新闻滚动、公告展示等场景。首先，我们先了解一下jQuery库及其基本用法，然后逐步解析...
要使用jquery实现文字上下滚动效果，首先需要了解jQuery的基本概念。jQuery是一个快速、小巧、功能丰富的JavaScript库，它简化了HTML文档遍历和操作、事件处理、动画以及Ajax交互。jQuery的使用使得复杂的JavaScript...
在Vue.js框架中，实现公告栏文字上下滚动的效果，可以通过利用Vue的动态组件和过渡效果来完成。这个功能在许多网页应用中常见，用于展示滚动通知或公告。下面将详细介绍如何使用Vue实现这一效果。 首先，我们需要...
在这个名为"jQuery实现的文字无缝上下滚动效果源码.zip"的压缩包中，包含了一个利用jQuery实现的文字滚动效果的源代码示例。 文字无缝上下滚动是一种常见的网页动态效果，常用于新闻更新、公告展示或者页面简介等...
总的来说，jQuery的文字上下滚动效果是通过结合CSS布局和jQuery动画方法实现的，它能够为网站增添动态效果，提升用户体验。通过熟练掌握这些技术，你可以轻松创建出各种复杂且吸引人的网页动态效果。