This article describes the method of using scrollbar events by js. Share it for your reference. The specific analysis is as follows:
I have been wondering before, how to monitor scrollbar events, but today I finally understand a little.
The following code is to listen to the scroll bar as long as it moves, and the div below returns to the top to display and hide the code.
window.onscroll = function () { var t = document.documentElement.scrollTop || document.body.scrollTop; if (t > 0) { $(".cbbfixed").css("bottom", "10px"); } else { $(".cbbfixed").css("bottom", "-85px"); } }Note:
t: The distance from the scroll bar to the top end
t>0, that is, once the scroll bar is scrolled, the if() statement is executed immediately. The code in else() is that when the scroll bar reaches the top, the div at the top is hidden.
Return to the click operation of the top button:
$("#cgotop").click(function(){ $('body,html').animate({ scrollTop: 0 }, 100); return false; });Replenish:
1. Listen to the scrollbar event of a certain element
$(selector).scroll(function(){......});2. Get the distance of scrolling
$(selector).scrollTop();$(selector).scrollLefft();
PS: Here I recommend an online query tool about JS events, which summarizes the commonly used event types and function functions of JS:
A complete list of javascript events and functions:
http://tools.VeVB.COM/table/javascript_event
I hope this article will be helpful to everyone's JavaScript programming.