博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js-新闻无缝滚动
阅读量:4355 次
发布时间:2019-06-07

本文共 1121 字,大约阅读时间需要 3 分钟。

HTML部分:

无缝滚动
  • 111111111111
  • 222222222222
  • 333333333333
  • 444444444444
  • 555555555555
  • 666666666666
  • 777777777777
  • 888888888888
  • 999999999999

    CSS部分:

    #box{
    height:240px; width:300px; margin:0 auto; border:1px solid #0066FF; overflow:hidden; padding-bottom:20px; } #box li{
    color:#333; padding:5px 0; } #box ul{
    margin:0; padding:0; }

    JS部分:

    var area=document.getElementById("box");var con1=document.getElementById("con1");var con2=document.getElementById("con2");con2.innerHTML=con1.innerHTML;function scrollUp(){    if(area.scrollTop>=con1.offsetHeight){        area.scrollTop=0;    }else{        area.scrollTop++;    }}var time=50;myscroll=setInterval("scrollUp()",time);area.onmouseover=function (){    clearInterval(myscroll);}area.onmouseout=function (){    myscroll=setInterval("scrollUp()",time);}

     

    转载于:https://www.cnblogs.com/lexie/p/6688159.html

    你可能感兴趣的文章
    HDUOJ-----2838Cow Sorting(组合树状数组)
    查看>>
    自定义控件之---抽屉式弹窗控件.
    查看>>
    一款纯css3实现的机器人看书动画效果
    查看>>
    加班与效率
    查看>>
    轻量级Modal模态框插件cta.js
    查看>>
    MyEclipse下SpringBoot+JSP整合过程及踩坑
    查看>>
    重定向和管道
    查看>>
    实验五
    查看>>
    STL学习笔记(第二章 C++及其标准程序库简介)
    查看>>
    Operator_countByValue
    查看>>
    Java 日期往后推迟n天
    查看>>
    Web应用漏洞评估工具Paros
    查看>>
    Git 和 Github 使用指南
    查看>>
    20180925-4 单元测试
    查看>>
    mysql的数据存储
    查看>>
    [转载] Activiti Tenant Id 字段释疑
    查看>>
    [Java 8] (8) Lambda表达式对递归的优化(上) - 使用尾递归 .
    查看>>
    SQL Server-聚焦移除Bookmark Lookup、RID Lookup、Key Lookup提高SQL查询性能
    查看>>
    最小权限的挑战
    查看>>
    jquery 视觉特效(水平滚动图片)
    查看>>