文字的向上滚动

最新推荐文章于 2022-01-18 10:30:32 发布

impossible1994727

最新推荐文章于 2022-01-18 10:30:32 发布

阅读量256

点赞数

分类专栏： animate css+js

本文链接：https://blog.csdn.net/impossible1994727/article/details/76690867

版权

css+js 同时被 2 个专栏收录

43 篇文章 1 订阅

订阅专栏

animate

2 篇文章 0 订阅

订阅专栏

.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)