js无间隙滚动
代码一:
var speed=; //设置文字滚动速度
dome2.innerHTML=dome1.innerHTML //复制dome1为dome2
function Marquee(){
if(dome2.offsetTop-dome.scrollTop<=) //当滚动至dome1与dome2交界时
dome.scrollTop-=dome1.offsetHeight //dome跳到最顶端
else{
dome.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed) //设置定时器
dome.onmouseover=function() {clearInterval(MyMar)}//鼠标移上时清除定时器达到滚动停止的目的
dome.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器,继续滚动
代码二:
var speed = ;
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<=) //当滚动至dome1与dome2交界时
demo2.scrollTop-=demo1.offsetHeight //dome跳到最顶端
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed) //设置定时器
demo.onmouseover=function() {clearInterval(MyMar);;}//鼠标移上时清除定时器达到滚动停止的目的
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器,继续滚动
代码三:
js无间隙滚动的更多相关文章
- JavaScript js无间断滚动效果 scrollLeft方法 使用模板
JavaScript js无间断滚动效果 scrollLeft方法 使用模板 <!DOCTYPE HTML><html><head><meta charset ...
- js无间隙向上滚动
一.优点:div可以load:缺点:滚动的时候有点娘,磨磨唧唧,不够干脆爽快 html <div id="my_msg" class="my-msg bg-whit ...
- 56.Qt-滚动字幕之无间隙滚动(原创)
1.描述 最近要实现一个滚动条字幕,但是搜到的系列文章都是利用定时器QTimer,在固定的时间截取文本并显示,这样滚动的时候其实是断断续续的,因为实际上是一个个字符位移实现的,不过实现方便. 所以只有 ...
- JS实现上下左右四方向无间隙滚动
想必大家都注意到<marquee>的不循环滚动,所以出现了很多替代脚本,或iframe或JS输出< marquee>,不管怎么做,都略显麻烦.下面说一下这个相对简单的实现思路: ...
- js 单行间隙滚动
代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...
- js 实现 间隙滚动效果
代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...
- JQuery插件:动态列和无间隙网格布局Mason.js
来源:GBin1.com 在线演示 JavaScript提供很多强有力的方案,解决动态列的网格布局(例如:Pinterest).这些方案很有效,但是,有时候,会造成网格的间隙或粗糙的边缘. Mason ...
- js文字向上滚动代码
js文字向上滚动代码 <style>.pczt_pingfen_jhxs_news1{ width:397px; background:#edfafd; padding-top:2px; ...
- 使用css实现无滚动条滚动+使用插件自定义滚动条样式
使用css实现无滚动条滚动,摘抄自:曹小萌博客 使用css实现无滚动条滚动,大体思路是在div外面再套一个div.这个div设置overflow:hidden.而内容div设置 overflow-x: ...
随机推荐
- [转]Spring——jar包详解
原文地址:http://my.oschina.net/huhaoren/blog/300856?p=1 spring.jar是包含有完整发布的单个jar包,spring.jar中包含除了 spring ...
- 关于ArrayList 容量问题
ArrayList 是实现List 接口的动态数组,即它的容量大小是可变的.允许包括null 在内的所欲元素. 每个ArrayList 实例都有一个容量,该容量是指用来存储列表元素的数组的大小.默认初 ...
- Echarts-axislabel文字过长导致显示不全或重叠
先看两张图 按目前情况,官方并为对axislabel的高度或者宽度做调整.所以解决方案只能从其他方案下手 解决方案有几种 第一种为上图解决方案 设置grid属性定义图的大小来释放空间,使得axisla ...
- BeautifulSoup_python3
1.错误排除 bsObj = BeautifulSoup(html.read()) 报错: UserWarning: No parser was explicitly specified, so I' ...
- 使用HttpSessionListener接口监听Session的创建和失效
转自:http://uule.iteye.com/blog/824115 HttpSessionListener : Session创建事件发生在每次一个新的session创建的时候,类似地Sessi ...
- YARN :Architecture
Apache Hadoop NextGen MapReduce (YARN) MapReduce has undergone a complete overhaul in hadoop-0.23 an ...
- 【BZOJ-2055】80人环游世界 上下界费用流 (无源无汇最小费用最大流)
2055: 80人环游世界 Time Limit: 10 Sec Memory Limit: 64 MBSubmit: 321 Solved: 201[Submit][Status][Discus ...
- sax 解析 xml
SAX(Simple API for XML) https://docs.oracle.com/javase/tutorial/jaxp/sax/parsing.html persons.xml &l ...
- Bzoj2648 SJY摆棋子
Time Limit: 20 Sec Memory Limit: 128 MB Submit: 3128 Solved: 1067 Description 这天,SJY显得无聊.在家自己玩.在一个 ...
- 洛谷P1345 [USACO5.4]奶牛的电信Telecowmunication
题目描述 农夫约翰的奶牛们喜欢通过电邮保持联系,于是她们建立了一个奶牛电脑网络,以便互相交流.这些机器用如下的方式发送电邮:如果存在一个由c台电脑组成的序列a1,a2,...,a(c),且a1与a2相 ...