| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Document</title> |
| <style type="text/css"> |
| * { |
| margin: 0; |
| padding: 0; |
| } |
| div { |
| width: 300px; |
| height: 150px; |
| overflow: hidden; |
| margin: 50px auto; |
| border: 1px solid gray; |
| text-align: center; |
| } |
| ul { |
| list-style: none; |
| } |
| li { |
| height: 30px; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="review_box"> |
| <ul id="comment1"> |
| <li>第一条:美女渭桥东,春还事蚕作。</li> |
| <li>第二条:五马如飞龙,青丝结金络。</li> |
| <li>第三条:不知谁家子,调笑来相谑。</li> |
| <li>第四条:妾本秦罗敷,玉颜艳名都。</li> |
| <li>第五条:绿条映素手,采桑向城隅。</li> |
| <li>第六条:使君且不顾,况复论秋胡。</li> |
| <li>第七条:寒螀爱碧草,鸣凤栖青梧。</li> |
| <li>第八条:托心自有处,但怪傍人愚。</li> |
| <li>第九条:徒令白日暮,高驾空踟蹰。</li> |
| </ul> |
| <ul id="comment2"></ul> |
| </div> |
| <script> |
| window.onload = roll(50); |
| |
| function roll(t) { |
| var ul1 = document.getElementById("comment1"); |
| var ul2 = document.getElementById("comment2"); |
| var ulbox = document.getElementById("review_box"); |
| ul2.innerHTML = ul1.innerHTML; |
| ulbox.scrollTop = 0; |
| var timer = setInterval(rollStart, t); |
| |
| ulbox.onmouseover = function () { |
| clearInterval(timer); |
| } |
| |
| ulbox.onmouseout = function () { |
| timer = setInterval(rollStart, t); |
| } |
| } |
| |
| |
| function rollStart() { |
| |
| var ul1 = document.getElementById("comment1"); |
| var ul2 = document.getElementById("comment2"); |
| var ulbox = document.getElementById("review_box"); |
| |
| if (ulbox.scrollTop >= ul1.scrollHeight) { |
| ulbox.scrollTop = 0; |
| } else { |
| ulbox.scrollTop++; |
| } |
| } |
| </script> |
| </body> |
| </html> |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· DeepSeek 开源周回顾「GitHub 热点速览」
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了