zoukankan      html  css  js  c++  java
  • HTML中文本自动向上滚动

    <html>
    <HEAD>
    <TITLE>文本自动向上滚动</TITLE>
    <META content="text/html; charset=gb2312" http-equiv=Content-Type>
    <STYLE type=text/css>
    #demo a {
    100%;
    overflow:hidden;
    font:12px
    /16px tahoma;
    display:block;
    text
    -decoration:none;
    margin:2px;
    color:#4a551c;
    padding
    -left:2px;
    text
    -align:left;
    }
    #demo a:hover {
    color:#ff6600;
    }
    </STYLE>
    </HEAD>
    <body>
    <div id="demo" style="overflow:hidden;height:132px;400px;border:1px solid #dde5bc;margin-left:300px; margin-top:100px;">
    <div id="demo1">
    <a href="#">伫立 在窗边 凝视 人来人往 飘散的发丝带着微雨</a>
    <a href="#">似乎 它也在期待</a>
    <a href="#">期待他的出现</a>
    <a href="#">天空飘着幸福的微雨</a>
    <a href="#">空气散发幸福的气息</a>
    <a href="#">她的脸上 堆满幸福的期待</a>
    <a href="#">雨无声无息地下着</a>
    <a href="#">雨丝变成了雨滴</a>
    <a href="#">慢慢地 地面有了停留的雨水</a>
    <a href="#">她的他 却始终没有出现</a>
    <a href="#">她的脸湿了</a>
    <a href="#">她对自己说 那不是泪</a>
    <a href="#">只是被雨打湿了</a>
    <a href="#">她记得</a>
    <a href="#">记得他陪她一起淋雨</a>
    <a href="#">记得他陪她看过的日出日落</a>
    <a href="#">现在 陪着她的</a>
    <a href="#">只有无声的雨</a>
    <a href="#">雨滴打在她的脸上</a>
    <a href="#">凉凉的 很冷 很冷</a>
    </div>
    <div id="demo2"></div>
    </div>
    <script>
    var speed
    =40
    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>
    </body>
    </html>
  • 相关阅读:
    mysql脚本导入导出
    centos6.9关闭防火墙
    hdfs 架构
    MySQL JOIN的使用
    六种方式,教你在SpringBoot初始化时搞点事情!
    mybatis快速入门
    有了Swagger2,再也不用为写Api文档头疼了
    kafka查看Topic列表及消费状态等常用命令
    @RequestMapping注解
    寻找写代码感觉(三)之使用 Spring Boot 编写接口
  • 原文地址:https://www.cnblogs.com/wangsaiming/p/2065652.html
Copyright © 2011-2022 走看看