我在做一个新闻标题滚动的效果,我在网上找了很多效果,但是放在我的页面上,效果就不怎么好了,
不管是什么代码。只要是匀速滚动的。滚完一轮之后,第一个标题第二次出现的时候会利马顶到最顶部去。
我一直找不到原因,求高手解析,或者有遇到过同样问题的朋友进来分享下经验。

解决方案 »

  1.   

    最好给个DEMO链接,或者把关键代码发上来看看。
      

  2.   

        <div id="div" style="height:100px; overflow:hidden; border:1px solid #000; margin:0; padding:0">
            <ul id="ul" style="margin:0; padding:0">
                <li>11111111111111111111111 </li>
                <li>2222222222222222222222 </li>
                <li>3333333333333333333333</li>
                <li>4444444444444444444444</li>
                <li>5555555555555555555555</li>
                <li>666666666666666666666666</li>
                <li>7777777777777777777777</li>
                <li>888888888888888888888 </li>
            </ul>
        </div>
        <script type="text/javascript">
        var div = document.getElementById("div")
        var ul = document.getElementById("ul");
        var ul1 = ul.cloneNode(true);
        ul1.removeAttribute("id")
        div.appendChild(ul1);
        function scroll()
        {
            div.scrollTop = div.scrollTop+1
            if(ul.offsetHeight  <= div.scrollTop) div.scrollTop = 0
        }
        window.setInterval(scroll,20)
        </script>
      

  3.   

    <!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>无标题文档</title>
    <script type="text/javascript" src="http://mhzx.wanmei.com/js/s0910.js"></script>
    <style>
    .p_box3{ margin-left:50px; margin-top:12px; width:500px; height:120px; overflow:hidden;}
    .p_box3 p{ font-size:12px; color:#000; line-height:1.8em;}
    .p_box3 ul{list-style:none; margin:0;}
    .p_box3 ul li{ float:left; display:inline;}
    </style>
    </head><body>
    <div id="zz_0910_z1" class="p_box3">
                         <ul>
                            <li style="width:200px;">                    
                            <P>一等奖:&nbsp;&nbsp;a76272344</P> 
                                <p>二等奖:&nbsp;&nbsp;monica19801001</p>
                                <p>二等奖:&nbsp;&nbsp;lbb630</p>
                                <p>三等奖:&nbsp;&nbsp;b396217089</p> 
                                <p>三等奖:&nbsp;&nbsp;lomsont</p> 
                                <p>三等奖:&nbsp;&nbsp;e36475da</p> 
                                <p>一等奖:&nbsp;&nbsp;a76272344</p> 
                                <p>二等奖:&nbsp;&nbsp;monica19801001</p>
                                <p>二等奖:&nbsp;&nbsp;lbb630</p>
                                <p>三等奖:&nbsp;&nbsp;b396217089</p> 
                                <p>三等奖:&nbsp;&nbsp;lomsont</p> 
                                <p>三等奖:&nbsp;&nbsp;e36475da</p> 
                            </li>
                            <li style="width:180px;">                    
                                <P>东北网通-桃花岛</P> 
                                <p>华北网通-流星雨</p>
                                <p>华东电信-君临天下</p>
                                <p>华南电信-奇门遁甲</p> 
                                <p>华北网通二区-紫禁城灬</p> 
                                <p>西部电信一区-大漠飞雪</p> 
                                <p>东北网通-桃花岛</p> 
                                <p>华北网通-流星雨</p>
                                <p>华东电信-君临天下</p>
                                <p>华南电信-奇门遁甲</p> 
                                <p>华北网通二区-紫禁城</p> 
                                <p>西部电信一区-大漠飞雪</p>
                            </li>
                            <li>                    
                                <P>丿灬疯起的忧伤</P> 
                                <p>Hero丨R丶 </p>
                                <p>灬丨冷 </p>
                                <p>丿丶首席法官</p> 
                                <p>灬不愿灬</p> 
                                <p>w丶至尊宝</p> 
                                <p>丿灬疯起的忧伤</p> 
                                <p>Hero丨R丶 </p>
                                <p>灬丨冷 </p>
                                <p>丿丶首席法官</p> 
                                <p>灬不愿灬</p> 
                                <p>w丶至尊宝</p>
                            </li>
                            </ul>
                                             </div>
                        <script type="text/javascript"> 
    var marquee = new ScrollText("zz_0910_z1");
    marquee.LineHeight = 60;
    marquee.Amount = 1;
    marquee.Timeout = 30;
    marquee.Delay = 50;
    marquee.Start();
    </script>
    </body>
    </html>
      

  4.   

    参考:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html>
    <head>
    <style>
    a{display:block;line-height:18px;text-decoration:none;color:#555;font-family:Arial;font-size:12px;}
    .shell{
     background:url(http://www.csrcode.cn/html/txdm_2/images/arrowb.gif) no-repeat 4px 5px;
     border:1px solid #aaa; 
     width:230px;
     padding:3px 2px 2px 26px; 
    }
    #div1{
     height:18px;
     overflow:hidden;
    }
    </style>
    </head>
    <body>
    <div class="shell">
     <div id="div1">
       <a href="#">我在做一个新闻标题滚动的效果,我在网上找了很多效果  </a>
       <a href="#">但是放在我的页面上,效果就不怎么好了!</a>
       <a href="#">不管是什么代码。只要是匀速滚动的 </a>
       <a href="#">或者有遇到过同样问题的朋友进来分享 </a>
     </div> 
    <div>
    </body>
    <script>
        var c, _ = Function;
        with (o = document.getElementById("div1")) { innerHTML += innerHTML; onmouseover = _("c=1"); onmouseout = _("c=0"); }
        (F = _("if(#%18||!c)#++,#%=o.scrollHeight>>1;setTimeout(F,#%18?10:1500);".replace(/#/g, "o.scrollTop")))();
    </script>
    </html>
      

  5.   

    http://www.popub.net/script/MSClass.html