zoukankan      html  css  js  c++  java
  • JavaScript设置div中的文字滚动起来 实现滚动效果

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>Title</title>
     6 </head>
     7 <body>
     8 <div id="i1" style=" 400px;
     9 height: 300px;
    10 position: absolute;
    11 left: 50%;
    12 top: 50%;
    13 margin-left: -200px;
    14 margin-top: -150px; ">欢迎任明霞莅临指导
    15 </div>
    16 <script>
    17     function f() {
    18         //根据id获取所对应的div,document意思是去整个html文档中找,getElementById是根据ID
    19         var tag = document.getElementById('i1')
    20         //拿到div中的文本,注意innertext方法没有括弧
    21         var content = tag.innerText
    22         //获取它这个字符串的第一个文字
    23         var z =content.charAt(0)
    24         //获取这个文本除第一个字以外的文本,用substring给它起始位置
    25         var  l = content.substring(1,content.length)
    26         //把第一个字符放到最后一位拼接起来
    27         var new_content = l+z
    28         //用新生成new_content把div中的文本替换掉
    29         tag.innerText = new_content
    30     }
    31     //setInterval是个定时器,第一个参数是要执行的内容,第二个参数是执行间隔,单位为毫秒
    32     setInterval('f()',100)
    33 </script>
    34 
    35 </body>
    36 </html>

  • 相关阅读:
    poj 1269(两条直线交点)
    poj 2398(叉积判断点在线段的哪一侧)
    poj 2318(叉积判断点在线段的哪一侧)
    HDU 5650 so easy
    POJ 1328 Radar Installation
    POJ 1017 Packets
    POJ 3190 Stall Reservations
    CodeForces 652A Gabriel and Caterpillar
    CodeForces 652B z-sort
    CodeForces 652C Foe Pairs
  • 原文地址:https://www.cnblogs.com/topzhao/p/9170714.html
Copyright © 2011-2022 走看看