Menu
When I tried to change the default scroll bar property, I found that it's not convenient by rewriting callback function for scroll() or onscroll events, instead, I should rewrite a callback function for "onwheel" events.
So what's the difference between onwheel and onscroll anyways? I imagine that default onwheel handler by browsers would automatically trigger onscroll function to move the scroll bar, which is why preventDefault in onwheel's callback will prevent scroll bar moving. Am I right? Who has a better and more specific explanation?
968
Definition and Usage. The onscroll event occurs when an element's scrollbar is being scrolled. Tip: use the CSS overflow style property to create a scrollbar for an element.
The scroll event is sent to an element when the user scrolls to a different place in the element. It applies to window objects, but also to scrollable frames and elements with the overflow CSS property set to scroll (or auto when the element's explicit height or width is less than the height or width of its contents).
The scroll event fires when the document view has been scrolled. For element scrolling, see Element: scroll event .
The onwheel event occurs when the mouse wheel is rolled up or down over an element. The onwheel event also occurs when the user scrolls or zooms in or out of an element by using a touchpad (like the "mouse" of a laptop).
onwheel specifically fires when the mouse wheel is spun. onscroll fires for any kind of scrolling, including keyboard buttons like the arrow keys, Home, End, Page Up, Page Down, space bar, tabbing etc.
Note that onwheel is non-standard and should be avoided unless you're specifically targeting browsers that support it and/or are providing an extra feature whose absence won't be felt.
67
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
