基于jquery的文字向上跑動(dòng)類(lèi)似跑馬燈的效果

字號(hào):


    想實(shí)現(xiàn)一個(gè)類(lèi)似跑馬燈的效果,發(fā)現(xiàn)跑馬燈有空格.效果也不美觀,于是用jquery寫(xiě)了個(gè)
    頁(yè)面代碼
    <div class=recordlist>
    <ul class=tpl-rotate-recordlist style=margin-top: 0px;>
    <li class=tpl-rotate-recordlist-item>
    恭喜187****5204獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜137****1372獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜156****0276獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜139****9856獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜136****0580獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜136****0580獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜138****8118獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜136****5555獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜136****0580獲得1000rbm
    </li>
    <li class=tpl-rotate-recordlist-item>
    恭喜136****0580獲得1000rbm
    </li>
    </ul>
    </div>
    js代碼
    /*自動(dòng)輪換xuyw*/
    var autoscroll = function(a) {
    $(a).find(ul:first).animate( {
    margintop : -20px
    }, 500, function() {
    $(this).css( {
    margintop : 0px
    }).find(li:first).appendto(this)
    })
    }
    if ($(.recordlist ul li).length > 0) {
    setinterval('autoscroll(.recordlist)', 2000)
    } else {
    $(.recordlist).hide()
    }