How do I get the browser scroll position in jQuery?

JavascriptJquery

Javascript Problem Overview


I have a web document with scroll. I want to get the value, in pixels, of the current scroll position. When I run the below function it returns the value zero. How can I do this?

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
<script type="text/javascript">
    $(function (){
        $('#Eframe').on("mousewheel", function() {
            alert(document.body.scrollDown)
        }
    })
</script>

Javascript Solutions


Solution 1 - Javascript

Since it appears you are using jQuery, here is a jQuery solution.

$(function() {
    $('#Eframe').on("mousewheel", function() {
        alert($(document).scrollTop());
    });
});

Not much to explain here. If you want, here is the jQuery documentation.

Solution 2 - Javascript

It's better to use $(window).scroll() rather than $('#Eframe').on("mousewheel")

$('#Eframe').on("mousewheel") will not trigger if people manually scroll using up and down arrows on the scroll bar or grabbing and dragging the scroll bar itself.

$(window).scroll(function(){
	var scrollPos = $(document).scrollTop();
	console.log(scrollPos);
});

If #Eframe is an element with overflow:scroll on it and you want it's scroll position. I think this should work (I haven't tested it though).

$('#Eframe').scroll(function(){
	var scrollPos = $('#Eframe').scrollTop();
	console.log(scrollPos);
});

Solution 3 - Javascript

Pure javascript can do!

var scrollTop = window.pageYOffset || document.documentElement.scrollTop;

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJitenderView Question on Stackoverflow
Solution 1 - Javascriptuser672118View Answer on Stackoverflow
Solution 2 - JavascriptDaniel TononView Answer on Stackoverflow
Solution 3 - JavascriptAmosView Answer on Stackoverflow