How to detect when scrolling occurs in JavaScript?

warehouse peon · #1 03-02-2010

Hi folks,
I have done many different events in JavaScript. I am not able to know how to detect when scrolling occurs in JavaScript? And also please tell me how to use that as a JavaScript event. If you provide the sample of the code that would be much useful for me. So its a kind request to give some coding related to the topic. Hope that you guys will help me soon..!!

MELTRONICS · #2 03-02-2010

I think that you should set a boolean flag, whose move should be stopped after moving the screen programmatically. By doing this the scroll-listener would first check against that flag and then do the respective actions. Otherwise instead of inline on the body command, you can also add the event called onscroll during the document.onReady event. Doing something like I did might help you. Check this script :

Code:

<script language="javascript">
    document.observe('user:scrolling', function() { alert('Wow!'); });
</script>
...
<body onscroll="document.fire('user:scrolling')">

CodGuru · #3 03-02-2010

I know the code for the JavaScript that detects an an element after the scrolling takes place into view. For this coding I have used the Yahoo User Interface. Hope that you will get some useful thing from this coding.

Code:

var Event = YAHOO.util.Event;
var Dom = YAHOO.util.Dom;
Event.on(window, 'load', function() {
    var y = Dom.getY('ft');
    Event.on(window, 'scroll', function() {
        var top = (document.documentElement.scrollTop ?
            document.documentElement.scrollTop :
            document.body.scrollTop);
        var vpH = Dom.getViewportHeight();
        var coverage = parseInt(vpH + top);
        if ( coverage >= y ) {
            console.log('Now in view!!!');
        }
    });
});

Allan.d · #4 03-02-2010

You need to do the scrolling when you are having a large image that had to be scrolled both vertically and horizontally to view it properly. For doing this you will have to use the position scrolled to before the image map unloaded. And after this you will have to insert a cookie on the viewer's machine to store scrollbar positions. By doing this when you hit back, the cookie will automatically scrolled to the last position they were at in the image map (scrollTo()). Hope that you will get some hint from this explanation.

opaper · #5 03-02-2010

You should know that the browsers store the current position of both the vertical and horizontal scrollbars in JavaScript properties. You can determine where the viewer have scrolled on your page by accessing the properties of browser to retrieve the pixel values. The value of the vertical scrollbar in a property is stored in Internet Explorer. This property is called as "document.body.scrollTop". Also the property called "document.body.scrollLeft" stores the value of the horizontal scrollbar in Internet Explorer.

Zecho · #6 03-02-2010

I am giving you some steps that are necessary for the scrolling event in JavaScript :

You can use the scrollbar positions after making your own custom "events" by polling for a change in any JavaScript property.
The pixel value of vertical scrollbar position is stored in property "document.body.scrollTop" and on other hand the horizontal scrollbar position is in "document.body.scrollLeft". This is about an Internet Explorer.
In the Netscape, the pixel value of vertical scrollbar position is stored in property "window.pageYOffset" and the horizontal scrollbar position is in "window.pageXOffset".
You can use the function setInterval() with a second function in order to detect changes in properties.

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search

Similar Threads for: "How to detect when scrolling occurs in JavaScript?"
Thread	Thread Starter	Forum	Replies	Last Post
Error occurs while connecting USB to the nokia C6-01	Siketan	Portable Devices	6	07-06-2011 05:49 PM
Help me to set up Windows Mail ( error occurs)	leadye	Technology & Internet	2	15-09-2009 09:33 AM
Problem to detect the javascript opener.	garfield1	Software Development	3	29-06-2009 11:58 PM
Vertical scrolling...jumps rather than smooth scrolling - Excel 20	Miller Man	Vista Hardware Devices	4	24-04-2009 08:36 AM
Detect IE 7 Protected mode using javascript	John	Vista Help	0	28-09-2008 05:03 PM

How to detect when scrolling occurs in JavaScript?

Software Development