文字的向上滚动

来源：互联网发布：网络电视怎么重新搜台编辑：程序博客网时间：2024/05/16 05:16

.gundong{
               height: 50px;
               overflow: hidden;
           }
           .gundong ul{
               list-style: none;
               width: 100%;
               display: block;
               height: 50px;
           }
           .gundong ul li{
               height: 50px;
               background: bisque;
               line-height: 50px;
           }

<div class="gundong">
           <ul>
               <li>dfh</li>
               <li>dfhdif</li>
               <li>feuif</li>
               <li>fhur</li>
               <li>fhuerfye</li>
               <li>ewrope</li>
               <li>pdfo</li>
           </ul>
       </div>

setInterval(function(){
               if(!$('.gundong ul').is(':animated')){
                   var hei =$('.gundong ul li').height();
                   var len = $('.gundong ul li').length;
                   var heilen = hei*len;
                   var whei = hei;
                   var mar1= parseInt($('.gundong ul').css('margin-top'));
                   var endmar = (parseInt((heilen/whei)-1)*whei);
                   if(mar1<=-endmar){
                       $('.gundong ul').animate({marginTop:'0px'},300)
                   }else{
                       $('.gundong ul').animate({marginTop:mar1-whei+'px'},300)
                   }
               }
           },3000)

阅读全文

0 0