0

Scriptperlative の CursorDivScroll スクリプトを実装する div があります。スクリプトを使用している div に 2 つのカスタマイズされたカーソルを実装するにはどうすればよいですか。下にスクロールするときに表示されるものと、上にスクロールするときに表示されるものは？これが私がこれまでに持っているjavascriptとHTMLです。JavaScript は単なる CursorDivScroll スクリプトです。

 <script type='text/javascript' >
     $(document).ready(function() {
 CursorDivScroll( 'repertoirescroll', 40, 40 ).noHorizontal();
     });
 </script> 


 #repertoirescroll {
 cursor: url(../images/arrow.png), auto;
 position:relative;

 }

事前に助けてくれてありがとう。if mousemove = mousedown use this cursor else if mousemove = up use this cursor...? という if ステートメントを実装する必要があると思います。これを行う方法がわからない。

4

1 に答える 1

1

scrollTopが減少しているか増加しているかを確認すると、上または下にスクロールしているかどうかがわかり、スクロール時にそれに基づいてカーソルを設定し、タイムアウトを使用してスクロールが停止したときにカーソルをリセットします。

var top=0, timer;

$(window).on('scroll', function() {
    clearTimeout(timer);
    var scrollTop = $(this).scrollTop(),
        cursor = scrollTop > top ? 'pointer' : 'wait';
    $('body').css('cursor', cursor);
    top = scrollTop;
    timer = setTimeout(function() {
        $('body').css('cursor', 'default');
    }, 500);
});​

フィドル

于 2012-09-12T23:47:48.313 に答える