鍍金池/ 問(wèn)答/HTML5  HTML/ 怎么讓一組數(shù)據(jù)來(lái)回不斷滾動(dòng)呢?點(diǎn)擊停止按鈕的時(shí)候則停止,點(diǎn)擊開(kāi)始則重新開(kāi)始?

怎么讓一組數(shù)據(jù)來(lái)回不斷滾動(dòng)呢?點(diǎn)擊停止按鈕的時(shí)候則停止,點(diǎn)擊開(kāi)始則重新開(kāi)始?

如題,
html:

 <div class="content">
        <div class="view-box">
            <div class="item-box">
                <div class="item">1</div>
                <div class="item">2</div>
                <div class="item">3</div>
                <div class="item">4</div>
                <div class="item">5</div>
                <div class="item">6</div>
                <div class="item">7</div>
                <div class="item">8</div>
                <div class="item">9</div>
                <div class="item">10</div>
            </div>
        </div>
    </div>
    
  <div class="btn-box">
    <div class="btn begin">點(diǎn)我抽獎(jiǎng)</div>
    <div class="btn" onclick="stop()">停止</div>
</div>  

js部分:
`var flag = true; //標(biāo)識(shí)是否滾動(dòng),默認(rèn)可以滾動(dòng)

var index = 0;
var maxTop ; //允許滾動(dòng)的最大位置
var length = $(".item-box").children().length-1;
maxTop = length * 150;

$(".begin").click(function () {
    if(flag){
        flag = false;
        letGo();
    }else{
        return false;
    }
});

//滾動(dòng)
var index = 0;
//console.log(maxTop);
function letGo(){
    index -= 150;
    //console.log(index)
    if(index < -maxTop){
        $(".item-box").css({"top":0});
        index = 0;
    }else{
        $(".item-box").animate({"top":index},"linear",function(){});
        }
    setTimeout(letGo,10);//循環(huán)執(zhí)行
}
//停止
function stop(){
    letGo = false;
}`

怎么讓10個(gè)itme循環(huán)著向上滾動(dòng)呢?

回答
編輯回答
吢涼

弄個(gè)定時(shí)器,點(diǎn)擊開(kāi)啟,或者關(guān)閉定時(shí)器。

2017年1月28日 15:39