js文字滚动停顿效果代码


Posted in Javascript onJune 28, 2008

<!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>间断滚动_3water.com_三水点靠木</title>
<style>
#Marquee{ height:60px; overflow:hidden;}
#Marquee div{ border:1px solid #DDD3FE; background:#EEECF4; height:58px;}
</style>
</head>
<body>
<div id="Marquee">
    <div style="width: 160px; height: 58px">间断-1-caiying2007</div>
    <div style="width: 160px; height: 58px">间断-2-caiying2007</div>
    <div style="width: 160px; height: 58px">间断-3-caiying2007</div>
</div>
<script>
var Mar = document.getElementById("Marquee");
var child_div=Mar.getElementsByTagName("div")
var picH = 60;//移动高度
var scrollstep=3;//移动步幅,越大越快
var scrolltime=20;//移动频度(毫秒)越大越慢
var stoptime=3000;//间断时间(毫秒)
var tmpH = 0;
Mar.innerHTML += Mar.innerHTML;
function start(){
    if(tmpH < picH){
        tmpH += scrollstep;
        if(tmpH > picH )tmpH = picH ;
        Mar.scrollTop = tmpH;
        setTimeout(start,scrolltime);
    }else{
        tmpH = 0;
        Mar.appendChild(child_div[0]);
        Mar.scrollTop = 0;
        setTimeout(start,stoptime);
    }
}
onload=function(){setTimeout(start,stoptime)};
</script></body>
</html>

Javascript 相关文章推荐
javascript window对象属性整理
Oct 24 Javascript
jQuery控制输入框只能输入数值的小例子
Mar 20 Javascript
JavaScript动态添加列的方法
Mar 25 Javascript
无阻塞加载js,防止因js加载不了影响页面显示的问题
Dec 18 Javascript
js中setTimeout的妙用--防止循环超时
Mar 06 Javascript
Angular通过angular-cli来搭建web前端项目的方法
Jul 27 Javascript
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 jQuery
浅谈Vue2.0父子组件间事件派发机制
Jan 08 Javascript
vue采用EventBus实现跨组件通信及注意事项小结
Jun 14 Javascript
vue+iview/elementUi实现城市多选
Mar 28 Javascript
vue设计一个倒计时秒杀的组件详解
Apr 06 Javascript
vue+echarts实现多条折线图
Mar 21 Vue.js
js兼容标准的表格变色效果
Jun 28 #Javascript
js查找父节点的简单方法
Jun 28 #Javascript
一个小型js框架myJSFrame附API使用帮助
Jun 28 #Javascript
JavaScript 给汉字排序实例代码
Jun 28 #Javascript
教你如何解密js/vbs/vbscript加密的编码异处理小结
Jun 25 #Javascript
JS解密入门 最终变量劫持
Jun 25 #Javascript
JS解密入门之凭直觉解
Jun 25 #Javascript
You might like
探讨:如何使用PHP实现计算两个日期间隔的年、月、周、日数
2013/06/13 PHP
php动态生成函数示例
2014/03/21 PHP
常用PHP框架功能对照表
2014/10/23 PHP
DHTML 中的绝对定位
2006/11/26 Javascript
jQuery学习3:操作元素属性和特性
2010/02/07 Javascript
基于JQuery的类似新浪微博展示信息效果的代码
2012/07/23 Javascript
基于JQuery模仿苹果桌面的Dock效果(初级版)
2012/10/15 Javascript
javaScript NameSpace 简单说明介绍
2013/07/18 Javascript
Javascript中引用示例介绍
2014/02/21 Javascript
js表单验证实例讲解
2016/03/31 Javascript
理解javascript对象继承
2016/04/17 Javascript
nodejs个人博客开发第一步 准备工作
2017/04/12 NodeJs
js移动端图片压缩上传功能
2020/08/18 Javascript
JavaScript适配器模式详解
2017/10/19 Javascript
基于vue监听滚动事件实现锚点链接平滑滚动的方法
2018/01/17 Javascript
React中如何引入Angular组件详解
2018/08/09 Javascript
VUE实现自身整体组件销毁的示例代码
2020/01/13 Javascript
JS运算符简单用法示例
2020/01/19 Javascript
解决ant design vue 表格a-table二次封装,slots渲染的问题
2020/10/28 Javascript
[03:44]2015国际邀请赛选手档案—Cloud9.NoTail
2015/07/28 DOTA
[58:00]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant BO3 第二场 2月7日
2021/03/11 DOTA
python使用cookie库操保存cookie详解
2014/03/03 Python
Python实现去除代码前行号的方法
2015/03/10 Python
Python线性方程组求解运算示例
2018/01/17 Python
Python pymongo模块用法示例
2018/03/31 Python
Python实现点阵字体读取与转换的方法
2019/01/29 Python
Python数据可视化:饼状图的实例讲解
2019/12/07 Python
TensorFlow命名空间和TensorBoard图节点实例
2020/01/23 Python
详解tensorflow之过拟合问题实战
2020/11/01 Python
德国在线订购鲜花:Fleurop
2018/08/25 全球购物
为什么如下的代码int a=100,b=100;long int c=a * b;不能工作
2013/11/29 面试题
护理毕业生自我鉴定
2014/02/11 职场文书
公务员群众路线心得体会
2014/11/03 职场文书
加入学生会自荐书
2015/03/05 职场文书
社区安全温馨提示语
2015/07/14 职场文书
2017年大学生寒假社会实践活动总结
2016/04/06 职场文书