jquery determines whether the scroll bar is rolled up or down, and if it reaches the bottom or top

Source: Internet
Author: User

jquery determines whether the scroll bar is rolled up or down, and if it reaches the bottom or top: Http://www.haorooms.com/post/jquery_scroll_upanddown

——————————————————————————————————————

Scroll bar scroll to load more content
To determine the direction of scrolling
function Scroll (FN) {
var beforescrolltop = Document.body.scrollTop | | Document.documentElement.scrollTop,
fn = fn | | function () {};
Window.addeventlistener ("Scroll", function () {
var afterscrolltop = Document.body.scrollTop | | Document.documentElement.scrollTop,
Delta = afterscrolltop-beforescrolltop;
if (delta = = 0) return false;
fn (Delta > 0?) "Down": "Up");
Beforescrolltop = Afterscrolltop;
}, False);
}
Call scrolling Direction: Load more comments When you reach the bottom and scroll down
Scroll (function (direction) {
if (direction== "down") {
Console.log (direction);

var scrolltop = $ (window). scrolltop ();
var scrollheight = $ (document). Height ();
var windowheight = $ (window). Height ();
Scroll to the bottom
if (scrolltop + windowheight = = scrollheight) {
$ (". Commlistul"). Append (' <li class= "Commlistli" ><figure class= "left" ></figure><!--content--><div class=" left Commlistcon "><p><span> Han Xuming </span>&nbsp;&nbsp;<span>1 hours ago </span></p ><p> to assume the Charter mission is the Korean Air company, is also the only airline in North Korea, due to all known reasons, North Korea can not obtain advanced passenger aircraft in Western countries, air Korea aircraft all the former Soviet model, many more than the normal service life. The route of the 148, for the medium and short-haul regional passenger aircraft, by the Ukrainian Antorov design bureau design, is a relatively new North Korea model, as North Korean leader Kim Jong-un often travel on the aircraft, also known as "Kim Jong-un plane." </p></div><div style= "Clear:both;" ></div> </li> ');
}
}
});

——————————————————————————————————————————————————————————

Determine the direction of the mouse wheel
var scrollfunc = function (e) {
var direct = 0;
E = e | | window.event;
if (E.wheeldelta) {//Judging browser ie, Google pulley event
if (E.wheeldelta > 0) {//When the pulley is scrolled upward
Alert ("Roller roll Up");
var scrolltop = $ (window). scrolltop ();
var scrollheight = $ (document). Height ();
var windowheight = $ (window). Height ();
Scroll to the bottom
if (scrolltop + windowheight = = scrollheight) {
$ (". Commlistul"). Append (' <li class= "Commlistli" ><figure class= "left" ></figure><!--content--><div class=" left Commlistcon "><p><span> Han Xuming </span>&nbsp;&nbsp;<span>1 hours ago </span></p ><p> to assume the Charter mission is the Korean Air company, is also the only airline in North Korea, due to all known reasons, North Korea can not obtain advanced passenger aircraft in Western countries, air Korea aircraft all the former Soviet model, many more than the normal service life. The route of the 148, for the medium and short-haul regional passenger aircraft, by the Ukrainian Antorov design bureau design, is a relatively new North Korea model, as North Korean leader Kim Jong-un often travel on the aircraft, also known as "Kim Jong-un plane." </p></div><div style= "Clear:both;" ></div> </li> ');
}
}
if (E.wheeldelta < 0) {//When the pulley scrolls down
Alert ("Roller rolling down");
}
} else if (e.detail) {//firefox pulley event
if (e.detail> 0) {//When the pulley is scrolled upward
Alert ("Roller roll Up");
var scrolltop = $ (window). scrolltop ();
var scrollheight = $ (document). Height ();
var windowheight = $ (window). Height ();
Scroll to the bottom
if (scrolltop + windowheight = = scrollheight) {
$ (". Commlistul"). Append (' <li class= "Commlistli" ><figure class= "left" ></figure><!--content--><div class=" left Commlistcon "><p><span> Han Xuming </span>&nbsp;&nbsp;<span>1 hours ago </span></p ><p> to assume the Charter mission is the Korean Air company, is also the only airline in North Korea, due to all known reasons, North Korea can not obtain advanced passenger aircraft in Western countries, air Korea aircraft all the former Soviet model, many more than the normal service life. The route of the 148, for the medium and short-haul regional passenger aircraft, by the Ukrainian Antorov design bureau design, is a relatively new North Korea model, as North Korean leader Kim Jong-un often travel on the aircraft, also known as "Kim Jong-un plane." </p></div><div style= "Clear:both;" ></div> </li> ');
}
}
if (e.detail< 0) {//When the pulley scrolls down
Alert ("Roller rolling down");
}
}
Scrolltext (direct);
}
To bind a page to a pulley scroll event
if (Document.addeventlistener) {
Document.addeventlistener (' Dommousescroll ', Scrollfunc, false);
}
Rolling pulley triggering Scrollfunc method
Window.onmousewheel = Document.onmousewheel = Scrollfunc;

jquery determines whether the scroll bar is rolled up or down, and if it reaches the bottom or top

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.