關于文字向左滾動,樣式的問題
<!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"> <head> <meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/> <title>js文字向左無縫滾動</title> </head> <body> <style?type="text/css"> .qimo8?{ overflow:?hidden; width:?300px; } .qimo8?.qimo?{ /*width:99999999px;*/ width:?8000%; height:?30px; } .qimo8?.qimo?div?{ float:?left; } .qimo8?.qimo?ul?{ float:?left; height:?30px; overflow:?hidden; zoom:?1; } .qimo8?.qimo?ul?li?{ float:?left; line-height:?30px; list-style:?none; } .qimo8?li?a?{ margin-right:?10px; color:?#444444; } </style> <div?id="demo"?class="qimo8"> <div?class="qimo"> <div?id="demo1"> <ul> <li> <a?href='/office/194/46163.htm'>回收站里的文件刪除了怎么恢復</a> </li> </ul> </div> <div?id="demo2"></div> </div> </div> <script?type="text/javascript"> var?demo?=?document.getElementById("demo"); var?demo1?=?document.getElementById("demo1"); var?demo2?=?document.getElementById("demo2"); demo2.innerHTML?=?document.getElementById("demo1").innerHTML; function?Marquee()?{ if(demo.scrollLeft?-?demo2.offsetWidth?>=?0)?{ demo.scrollLeft?-=?demo1.offsetWidth; }?else?{ demo.scrollLeft++; } } var?myvar?=?setInterval(Marquee,?30); demo.onmouseout?=?function()?{ myvar?=?setInterval(Marquee,?30); } demo.onmouseover?=?function()?{ clearInterval(myvar); } </script> </body> </html> </td> </tr> </table>
這里面?
.qimo8?.qimo?{ /*width:99999999px;*/ width:?8000%; height:?30px; }
這個是什么原理啊,求指教
2017-05-16
width:?8000%;這個地方的寬度主要是要比兩個demo的長度長即可,我試了一下,改成width:200%也能正常運行,這里寫成8000%只是個人喜好吧`(/= _ =)