<style>
*{margin:0px;padding:0px;border:0px;}
body{font-size:12px}
#demo1{
height:auto;
text-align:left;
}
#demo2{
height:auto;
text-align:left;
}
#demo1 li{
list-style-type:none;
height:22px;
background:url() no-repeat left center;
text-align:left;
text-indent:15px;
}
#demo2 li{
list-style-type:none;
height:22px;
background:url() no-repeat left center;
text-align:left;
text-indent:15px;
}
</style>
</head>
<body>
<div id="demo" style="overflow:hidden;height:50px;width:280px;">
<ul id="demo1">
<li><a href="#" target="_blank">1</a></li>
<li><a href="#" target="_blank">2</a></li>
<li><a href="#" target="_blank">3</a></li>
<li><a href="#" target="_blank">4</a></li>
<li><a href="#" target="_blank">5</a></li>
<li><a href="#" target="_blank">6</a></li>
<li><a href="#" target="_blank">7</a></li>
</ul>
<div id="demo2"></div>
</div>
<script>
var speed=100
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<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>

JS无缝文字滚动(兼容各大浏览器)的更多相关文章

  1. ☆☆☆☆☆Placeholder兼容各大浏览器的例子☆☆☆☆☆

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. js 实现文字滚动功能,可更改配置参数 带完整版解析代码。

    前言:         本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽.         本篇文章为您分析一下原生JS写文字滚动效果 需求分析: 需要 ...

  3. 阻止a标签跳转四种方法 兼容各大浏览器(包括IE)

    阻止a标签跳转四种方法 兼容各大浏览器(包括IE) HTML <!--第一种--> <a href="javascript:;">我不会被跳转</a& ...

  4. JavaScript 兼容各大浏览器阻止冒泡事件

    JavaScript 兼容各大浏览器阻止冒泡事件 function stopEvent(event) { //阻止冒泡事件 //取消事件冒泡 var e = arguments.callee.call ...

  5. JS回车事件,兼容目前所有浏览器

    <script type="text/javascript" language=JavaScript charset="UTF-8"> docume ...

  6. 简单实现兼容各大浏览器的js复制内容到剪切板

    因为网站文章需要提供几个按钮,单击后实现复制文章内容到剪贴板. 在网上搜索了很多内容,发现都比较乱这里自己整理下,分享给大家 效果图如下: 之前使用的是window.clipboardData.set ...

  7. js的window.onscroll事件兼容各大浏览器

    为窗口添加滚动条事件其实非常的简单, window.onscroll=function(){}; 注意在获取滚动条距离的时候 谷歌不识别document.documentElement.scrollT ...

  8. js 实现复制到剪切板 复制按钮兼容各大浏览器

    zeroclipboard官网:https://github.com/zeroclipboard/ZeroClipboard 下载压缩包,得到两个“ZeroClipboard.js”和“ZeroCli ...

  9. js原生代码编写一个鼠标在页面移动坐标的检测功能,兼容各大浏览器

    function mousePosition(e) {     //IE9以上的浏览器获取     if (e.pageX || e.pageY) {         return {         ...

随机推荐

  1. 【ps】gif动态图白边问题

    (从死了一次又一次终于挂掉的百度空间中抢救出来的,发表日期 2014-08-13) 在制作gif动态图的时候发现有白边问题 网上说可以设成索引,但是这样一整连动画帧都一块丢掉了. 最终解决办法: 将要 ...

  2. sc7731 Android 5.1 LCD驱动简明笔记之二

    此篇笔记基于sc7731 - android 5.1,对lcd的framebuffer做一个简明笔记. 一共分为两大部分:第一部分,关于LCD的硬件方面的:第二部分,关于lcd核心处理(framebu ...

  3. Windows Server 2012远程刷新客户端组策略,IE代理设置

    Windows Server 2012远程刷新客户端组策略: 1.PowerShell命令对单台计算机进行刷新: Invoke-GPUpdate -RandomDelayInMinutes 0 -Co ...

  4. 四月二十五日,bugzilla for CentOS 安装

    Bugzilla for CentOS 5.4 制作人,陈浩 时间:2014.4.25 原创 文件夹 Bugzilla for CentOS 5.4 一. 装系统 1) 新建虚拟机  15G硬盘,51 ...

  5. Codeforces Round #342 (Div. 2) A - Guest From the Past 数学

    A. Guest From the Past 题目连接: http://www.codeforces.com/contest/625/problem/A Description Kolya Geras ...

  6. Codeforces Beta Round #5 C. Longest Regular Bracket Sequence 栈/dp

    C. Longest Regular Bracket Sequence Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.c ...

  7. C#的WinForm中制作饼状图和柱状图

    using System; using System.IO;//用于文件存取 using System.Data;//用于数据访问 using System.Drawing;//提供画GDI+图形的基 ...

  8. [置顶] Android开发之MediaPlayerService服务详解(一)

    前面一节我们分析了Binder通信相关的两个重要类:ProcessState 和 IPCThreadState.ProcessState负责打开Binder 驱动,每个进程只有一个.而 IPCThre ...

  9. win7远程桌面连接

    远程桌面连接 1.在防火墙上设置同意同意远程桌面通过防火墙: 2.为管理员设置password.以便訪问者訪问: 3.我的电脑-右键属性-远程设置-远程-选上"同意远程协助远程这台计算机.同 ...

  10. Qt Quick实现的涂鸦程序

    之前一直以为 Qt Quick 里 Canvas 才干够自绘.后来发觉不是,原来还有好几种方式都能够画图! 能够使用原始的 OpenGL(Qt Quick 使用 OpenGL 渲染).能够构造QSGN ...