0

特定のスパンクラスタグまで、次と前のボタンをクリックしてドキュメントをスクロールするjqueryスクリプトがあります...クラスが自動の最初のスパンまでスクロールするように変更するにはどうすればよいですか...どういうわけか、ロード中のウィンドウ、ドキュメントの準備ができているか、またはそれで?

現在の状況: http://jsfiddle.net/dzorz/qgPch/

html:

<div id="nav-dock"> 
<a id="prev" href="#">&uarr; Prev</a> 
<a id="next" href="#">&darr; Next</a>
</div>
<br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br>
<div class=text>
<b>First</b>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
In iaculis augue sapien, in facilisis lorem ullamcorper eu. 
Nunc at nulla metus. 
Pellentesque posuere quam id nunc 
<span class="highlight1">posuere</span> sagittis. 
Vivamus varius euismod nisi, ac condimentum mauris aliquam vitae. 
Ut faucibus eros vitae pharetra eleifend. 
Pellentesque volutpat facilisis porttitor. Nullam in turpis a nulla placerat placerat.    
</div>
<br><br><br><br><br><br><br><br><br><br>
<div class=text>
<b>Second</b>
Cras semper purus sit amet euismod molestie. 
Vivamus dapibus hendrerit elit eget tristique. Ut pulvinar adipiscing magna, 
eget viverra risus sollicitudin et. Morbi odio lacus, malesuada vel dapibus 
vitae, blandit ut metus. Vivamus cursus fringilla 
<span class="highlight1">felis</span> id facilisis.   
</div>
<br><br><br><br><br><br><br><br><br><br>
<div class=text>
<b>Third</b>
Aliquam et mattis mi. Mauris vel sagittis orci, id tempor neque. Aenean at arcu 
eu quam suscipit fermentum. Sed tempor, urna in malesuada sollicitudin, 
nulla erat <span class="highlight1">malesuada</span> ligula, 
sed ultricies ipsum dui a dui. Ut at sem quis lectus aliquet vulputate.     
</div>
<br><br><br><br><br><br><br><br><br><br>
<div class=text>
<b>Fifth</b>
Praesent sagittis tortor a purus euismod ultrices eu vitae est. 
Vivamus a facilisis dolor. Donec id tincidunt erat. Fusce elementum imperdiet 
augue, at pretium lectus <span class="highlight1">dictum</span> sit amet. 
Nullam pharetra dui arcu, ut tempus nulla interdum non. Etiam et mattis augue.    
</div>

脚本:

$(function() {

function scroll(direction) {

    var scroll, i,
            positions = [],
            here = $(window).scrollTop(),
            collection = $('.highlight1');

    collection.each(function() {
        positions.push(parseInt($(this).offset()['top'],10));
    });

    for(i = 0; i < positions.length; i++) {
        if (direction == 'next' && positions[i] > here) { scroll = collection.get(i); break; }
        if (direction == 'prev' && i > 0 && positions[i] >= here) { scroll = collection.get(i-1); break; }
    }

    if (scroll) {
        $.scrollTo(scroll, {
            duration: 750       
        });
    }

    return false;
}

$("#next,#prev").click(function() {        
    return scroll($(this).attr('id'));        
});

});

私を助けてください、あなたは私のjsfiddleを更新することができます

4

1 に答える 1