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="width: 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>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM