- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <script type="text/javascript">
- function $(id)
- {
- return document.getElementById(id);
- }
- window.onload = function()
- {
- var demo1 = $("demo1");
- var demo2 = $("demo2");
- demo2.innerHTML = demo1.innerHTML;
- alert($("demo2").offsetHeight);
- window.setInterval(textscroll,50);
- }
- function textscroll()
- {
- var demo = $("demo");
- if(demo.scrollTop-$("demo2").offsetHeight>=0) //问题一:怎么判断出滚动条出来的部分就是demo2的总高?
- {
- demo.scrollTop = 0;
- }else
- {
- demo.scrollTop++;
- }
-
- }
- </script>
- <style>
- *{ margin:0px; padding:0px}
- ul{ list-style:none}
- #demo{ border:#999 solid ; text-align:center; background:#930;width:150px; height:160px; overflow:hidden; margin:auto}
- </style>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>无标题文档</title>
- </head>
- <body>
- <div id="demo">
- <div id="demo1">
- <ul>
- <li>11111111</li>
- <li>22222222</li>
- <li>33333333</li>
- <li>44444444</li>
- <li>55555555</li>
- <li>66666666</li>
- <li>77777777</li>
- <li>88888888</li>
- <li>99999999</li>
- <li>00000000</li>
- </ul>
- </div>
- <div id="demo2"></div>
- </div>
- </body>
- </html>
复制代码 以上是我写的一个简单的无限字符滚动样式。可是现在我就不太懂问题一中的,如果我将其把demo2的高调少点还是管用的, 但是调多就不管用了。
是因为我把demo的高设定的正好就是demo2的高的原因吗?有没有人帮忙解答下。我思路有点乱,滚动条的高就是没显示内容高是这样吗? |