编程 Javascript

分别用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 相关文章推荐

JavaScript 数组的 uniq 方法

Jan 23 Javascript

JavaScript下利用fso判断文件是否存在的代码

Dec 11 Javascript

JS替换文本域内的回车示例

Feb 18 Javascript

JQuery之proxy实现绑定代理方法

Aug 01 Javascript

基于JavaScript Array数组方法(新手必看篇)

Aug 20 Javascript

让浏览器崩溃的12行JS代码(DoS攻击分析及防御)

Oct 10 Javascript

基于jQuery和CSS3实现APPLE TV海报视差效果

Jun 16 jQuery

基于LayUI分页和LayUI laypage分页的使用示例

Aug 02 Javascript

解决vue 中 echart 在子组件中只显示一次的问题

Aug 07 Javascript

Vuex实现数据增加和删除功能

Nov 11 Javascript

typescript配置alias的详细步骤

Aug 12 Javascript

React倒计时功能实现代码——解耦通用

Sep 18 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