<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. 2014年QS世界大学排名

    新浪教育[微博]讯 近日2014QS世界大学排行榜发布,榜单前十强均为英美名校.其中麻省理工大学以绝对优势位居榜首:英国剑桥大学及帝国理工学院并列排名第二:哈佛大学较去年而言名次略微下降,跌至第四. ...

  2. Flex4 DataGrid ItemRenderer内嵌方式

    Flex4 DataGrid ItemRenderer像Flex3一直内嵌ItemRenderer会报空对象引用的错误,如: <s:GridColumn dataField="titl ...

  3. ISO 9141-2 and ISO 14230-2 INITIALIZATION and DATA TRANSFER

    http://ecad.tu-sofia.bg/et/2005/pdf/Paper097-P_Dzhelekarski1.pdf INITIALIZATION Prior to any diagnos ...

  4. SMARTFORM报表程序设计(1)

    SMARTFORM是SAP提供的一款商务单据及报表设置工具,可以在FORM中实现数据的计算及转换等功能,并能在FORM创建的同时生成功能模块,为FORM和ABAP程序提供更为强大的参数接口.输入T-C ...

  5. LFS7.4编译笔记(3)

    在第一部分,我们编译了一个工具链及临时系统,然后在第二部分我们chroot到/mnt/lfs下面,利用临时系统的工具编译了我们最终的LFS系统.不过此时,我们的LFS系统还是不完整的,因为我们还没有安 ...

  6. JavaEE系列之(三)JDBC操作MySQL数据库

    一.JDBC简介        JDBC(Java Data Base Connectivity)java数据库连接        SUN公司为了简化.统一对数据库的操作,定义了一套Java操作数据库 ...

  7. cocos2dx 读取json及解析

    ball.json 数据例如以下: { "entities": [ { "entity": { "TapOpposite": 0, &quo ...

  8. UNIX/Linux网络编程基础:应用层协议简介

    目录 1.HTTP协议 2.FTP协议 3.TELNET协议 4.NFS协议 1.HTTP协议 应用层协议HTTP协议是Web的核心.HTTP协议在Web的客户程序和服务器程序中得以实现,运行在不同系 ...

  9. SimpleUrlHandlerMapping 处理器映射的配置--转

    http://blog.csdn.net/rainier001/article/details/6860491 <?xml version="1.0" encoding=&q ...

  10. uboot 网络不通问题解决一例1

    平台:Hi3531 PHY:RTL8211 现象:在uboot中执行ping命令的时候,总是超时. 过程: 使用uboot自带的phy操作命令mii读出的数据全是0xff.这里要介绍一下uboot中的 ...