您的位置:首页 > 其它

文字的向上滚动

2017-08-04 17:32 309 查看
.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)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: