Jquery uses iscorll to pull up, pull down, and load and refresh

Jquery uses iscorll to pull up, pull down, and load and refresh

The implementation principle is: Determine whether fiiptop and flipdown are displayed as the basis

MyScroll = new iScroll ('wraphome', {fixedScrollbar: true, hideScrollbar: true, fadeScrollbar: true, hScrollbar: false, vScrollbar: true, onScrollMove: function () {var topstat = $ (". fliptop "). is (": visible"); var downstat = $ (". flipdown "). is (": visible"); if (this. y> 15 &&! Topstat &&! Downstat) {$ (". fliptop "). fadeIn (300);} else if (this. y <15 & topstat) {$ (". fliptop "). hide ();} else if (this. y <(this. maxScrollY-25 )&&! Topstat &&! Downstat) {$ (". flipdown "). fadeIn (300); this. refresh (); // here is the position at the bottom of the refresh when the display is loading} else if (this. y> (this. maxScrollY + 25) & downstat) {$ (". flipdown "). hide () ;}}, onTouchEnd: function () {var topstat =$ (". fliptop "). is (": visible"); var downstat = $ (". flipdown "). is (": visible"); if (topstat &&! Downstat) {$ (". fliptop" ).html ("loading ...... "); SetTimeout (function () {// here is your own logical method}, 3000);} else if (downstat &&! Topstat) {$ (". flipdown" ).html ("loading ...... "); SetTimeout (function () {// here is your own logical method}, 3000 );}}});

Page Section

<Div id = "wraphome" class = "scroll"> <div class = "scroll-inner"> <div class = "fliptop"> Start loading... </div> <div class = "list"> ............. </div> <div class = "flipdown"> let's start loading... </div>