Possible Duplicate:
How can I determine the direction of a jQuery scroll event?
I need a function that detects if I scrolling UP or Down in Javascript/jquery to Fire Some events.
Something Like This:
if(ScrollTop)
{
alert('SCROLL TOP');
}
else if(ScrollDown)
{
alert('SCROLL DOWN');
}
It's simple solution working in all browsers: jQuery.
Here is the solution: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/Q_25533492.html
<html>
<head>
<style>
div { color:blue; }
p { color:green; }
span { color:red; display:none; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div>Try scrolling the iframe.</div>
<p>Paragraph - <span>Scroll happened!</span></p>
<script>
$("p").clone().appendTo(document.body);
$("p").clone().appendTo(document.body);
$("p").clone().appendTo(document.body);
var lastScrollTop = 0
var currentScrollTop = 0
$(window).scroll(function (event) {
lastScrollTop = currentScrollTop
currentScrollTop = $(document).scrollTop()
if (currentScrollTop > lastScrollTop)
$("span").text("going down")
else
$("span").text("going up")
$("span").css("display", "inline").fadeOut("slow");
});
</script>
</body>
</html>
Basically it's just detecting current scroll position.
Something like this http://jsfiddle.net/SjFNq/
$(window).scroll(function(){
var prevTop = $(window).data("top");
var newTop = $(this).scrollTop();
if(prevTop)
{
if(prevTop>newTop )
{
alert("top");
}
else{
alert("bottom");
}
}
$(window).data("top",newTop );
});
