Используйте мышь для прокрутки на div для запуска анимации?

Question

<div class="page"> 
     div content 
</div> 

<script> 

if(scroll mouse up while hovering #page) 
$('.page').animate({'left':'+40px'}); 

if(scroll mouse down while hovering #page) 
$('.page').animate({'left':'-40px'}); 

</script> 

Я хочу сделать что-то вроде приведенного выше примера. Кто-нибудь может мне помочь?

Answer 1

Вы можете использовать this mousewheel plugin, а затем:

$('.page').mousewheel(function(event, delta) { 
    event.preventDefault(); // if you want to prevent the window from scrolling 

    $(this).animate({left: (delta>0 ? '+' : '-')+'40px'}); 
}); 

Answer 2

Вы можете обнаружить прокрутки вверх и вниз с родной scroll() функции JQuery, как так:

var tempScrollTop, currentScrollTop = 0; 

$('#div').scroll(function() { 
    currentScrollTop = $('#div').scrollTop(); 
    if (tempScrollTop < currentScrollTop) { 
     // UP 
    } else if (tempScrollTop > currentScrollTop) { 
     // DOWN 
    } 
    tempScrollTop = currentScrollTop;     
} 

Взятые из комментариев в http://api.jquery.com/scroll/