JavaScriptは自動的に上下にスクロールし、いつでもキャンセルします

Question

私はボタン付きウェブサイトを持っています。 ボタンを押すと、ページ（ボディ）が永遠に上下に自動スクロールします。

私は自分でページをスクロールしようとすると、自動スクロールはボタンを再起動するまで直ちに停止する必要があります。

私はオートスクロールを行う方法について多くの記事を見つけましたが、この文脈ではそれを止めることはできません。

アイデア？

Answer 1

こんにちは、あなたは永遠に "アップオートスクロールダウン" とはどういう意味ですか？この例からlink

<div id="listofstuff"> 
    <div class="anitem"> 
     <span class="itemname">Item1</span> 
     <span class="itemdescruption">AboutItem1</span> 
    </div> 
    <div class="anitem"> 
     <span class="itemname">Item2</span> 
     <span class="itemdescruption">AboutItem2</span> 
    </div> 
    <div class="anitem"> 
     <span class="itemname">Item3</span> 
     <span class="itemdescruption">AboutItem3</span> 
    </div> 
    <div class="anitem"> 
     <span class="itemname">Item4</span> 
     <span class="itemdescruption">AboutItem5</span> 
    </div> 
    <div class="anitem"> 
     <span class="itemname">Item5</span> 
     <span class="itemdescruption">AboutItem5</span> 
    </div> 
</div> 

と

$(document).ready(function() { 
    var wrapper = $('#listofstuff'), 
    element = wrapper.find('.anitem'), 
    lastElement = wrapper.find('.anitem:last-child'), 
    lastElementTop = lastElement.position().top, 
    elementsHeight = element.outerHeight(), 
    scrollAmount = lastElementTop - 2 * elementsHeight; 

    $('#listofstuff').animate({ 
     scrollTop: scrollAmount 
    }, 1000, function() { 
     lastElement.addClass('current-last'); 
    }); 
}); 

と

.anitem { 
    height:58px; 
    background:#eee; 
    border-top: 1px solid #bbb; 
    border-bottom: 1px solid #fff; 
    padding:20px; 
    color:000; 
    font-family: Helvetica,Arial, Verdana,sans-serif; 
    -webkit-transition: all 1000ms; 
} 
.anitem.current-last{ 
    background: #99d; 
} 
#listofstuff { 
    width:300px; 
    height:300px; 
    overflow:auto; 
}