分别用marquee和div+js实现首尾相连循环滚动效果,仅3行代码


Posted in Javascript onSeptember 21, 2011
<!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> 
<TITLE>分别用marquee和div+js实现首尾相连循环滚动效果</TITLE> 
</HEAD> 
<BODY> 
用marquee实现首尾相连循环滚动效果(仅IE):<br /><br /> 
<MARQUEE behavior="scroll" contenteditable="true" onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" scrollamount="3" width="100"><SPAN unselectable="on">这里是要滚动的内容</SPAN></MARQUEE> 
<br /><br />用DIV+javascript实现首尾相连循环滚动效果(兼容firefox):<br /><br /> 
<DIV id="scrollobj" style="white-space:nowrap;overflow:hidden;width:500px;"><span>这里是要滚动的内容</span></DIV> 
<script language="javascript" type="text/javascript"> 
<!-- 
function scroll(obj) { 
var tmp = (obj.scrollLeft)++; 
//当滚动条到达右边顶端时 
if (obj.scrollLeft==tmp) obj.innerHTML += obj.innerHTML; 
//当滚动条滚动了初始内容的宽度时滚动条回到最左端 
if (obj.scrollLeft>=obj.firstChild.offsetWidth) obj.scrollLeft=0; 
} 
setInterval("scroll(document.getElementById('scrollobj'))",20); 
//--> 
</script> 
</BODY> 
</HTML>
Javascript 相关文章推荐
js和jquery批量绑定事件传参数一(新猪猪原创)
Jun 23 Javascript
JS中批量给元素绑定事件过程中的相关问题使用闭包解决
Apr 15 Javascript
JS关键字球状旋转效果的实例代码
Nov 29 Javascript
根据表格中的某一列进行排序的javascript代码
Nov 29 Javascript
使用jquery动态加载js文件的方法
Dec 24 Javascript
JavaScript实现基于十进制的四舍五入实例
Jul 17 Javascript
基于jQuery实现复选框是否选中进行答题提示
Dec 10 Javascript
Bootstrap table使用方法详细介绍
Dec 09 Javascript
详解vue.js的devtools安装
May 26 Javascript
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)
Sep 19 Javascript
Vue formData实现图片上传
Aug 20 Javascript
Dom操作之兼容技巧分享
Sep 20 #Javascript
js获取图片大小的函数代码
Sep 20 #Javascript
javascript中的注释使用与注意事项小结
Sep 20 #Javascript
70+漂亮且极具亲和力的导航菜单设计国外网站推荐
Sep 20 #Javascript
JavaScript高级程序设计 学习笔记 js高级技巧
Sep 20 #Javascript
跨浏览器通用、可重用的选项卡tab切换js代码
Sep 20 #Javascript
JQuyer $.post 与 $.ajax 访问WCF ajax service 时的问题需要注意的地方
Sep 20 #Javascript
You might like
vBulletin HACK----显示话题大小和打开新窗口于论坛索引页
2006/10/09 PHP
php 8小时时间差的解决方法小结
2009/12/22 PHP
深入php var_dump()函数的详解
2013/06/05 PHP
ThinkPHP控制器详解
2015/07/27 PHP
PHP中使用substr()截取字符串出现中文乱码问题该怎么办
2015/10/21 PHP
PHP中file_exists使用中遇到的问题小结
2016/04/05 PHP
PHP MYSQL简易交互式站点开发
2016/12/27 PHP
php base64 编码与解码实例代码
2017/03/21 PHP
通过源码解析Laravel的依赖注入
2018/01/22 PHP
验证javascript中Object和Function的关系的三段简单代码
2010/06/27 Javascript
JavaScript浏览器选项卡效果
2010/08/25 Javascript
js操作iframe的一些方法介绍
2013/06/25 Javascript
jquery实现图片渐变切换兼容ie6/Chrome/Firefox
2013/08/02 Javascript
weUI应用之JS常用信息提示弹层的封装
2016/11/21 Javascript
非常优秀的JS图片轮播插件Swiper的用法
2017/01/03 Javascript
微信小程序 slider的简单实例
2017/04/19 Javascript
Windows下快速搭建NodeJS本地服务器的步骤
2017/08/09 NodeJs
JS实现对json对象排序并删除id相同项功能示例
2018/04/18 Javascript
JavaScript轮播停留效果的实现思路
2018/05/24 Javascript
微信小程序实现倒计时调用相机自动拍照功能
2018/06/10 Javascript
Js 利用正则表达式和replace函数获取string中所有被匹配到的文本(推荐)
2018/10/28 Javascript
vue使用vuex实现首页导航切换不同路由的方法
2019/05/08 Javascript
layui添加动态菜单与选项卡
2019/07/26 Javascript
微信小程序HTTP请求从0到1封装
2019/09/09 Javascript
python实现分析apache和nginx日志文件并输出访客ip列表的方法
2015/04/04 Python
python 调用win32pai 操作cmd的方法
2017/05/28 Python
Python中用字符串调用函数或方法示例代码
2017/08/04 Python
Python及Django框架生成二维码的方法分析
2018/01/31 Python
pandas 取出表中一列数据所有的值并转换为array类型的方法
2018/04/11 Python
Python通过for循环理解迭代器和生成器实例详解
2019/02/16 Python
django model通过字典更新数据实例
2020/04/01 Python
Selenium结合BeautifulSoup4编写简单的python爬虫
2020/11/06 Python
会计专业的自荐信
2013/12/12 职场文书
安全教育心得体会
2013/12/29 职场文书
《莫泊桑拜师》教学反思
2016/02/22 职场文书
Redis如何一键部署脚本
2021/04/12 Redis