2019-01-28 下拉加载更多引用js

2019-01-28  本文已影响0人  jakeliukai

var refresher = {

info: {

"pullDownLable": "下拉刷新",

"pullingDownLable": "释放立即刷新",

"pullUpLable": "上拉加载更多",

"pullingUpLable": "释放加载更多",

"loadingLable": "加载中..."

},

init: function(parameter) {

var wrapper = document.getElementById(parameter.id);

var div = document.createElement("div");

div.className = "scroller";

wrapper.appendChild(div);

var scroller = wrapper.querySelector(".scroller");

var list = wrapper.querySelector("#" + parameter.id + " ul");

scroller.insertBefore(list, scroller.childNodes[0]);

var pullDown = document.createElement("div");

pullDown.className = "pullDown hide";

var loader = document.createElement("div");

loader.className = "pullDownIcon";

pullDown.appendChild(loader);

var pullDownLabel = document.createElement("div");

pullDownLabel.className = "pullDownLabel hide";

pullDown.appendChild(pullDownLabel);

scroller.insertBefore(pullDown, scroller.childNodes[0]);

var pullUp = document.createElement("div");

pullUp.className = "pullUp hide";

var loader = document.createElement("div");

loader.className = "pullUpIcon";

pullUp.appendChild(loader);

var pullUpLabel = document.createElement("div");

pullUpLabel.className = "pullUpLabel hide";

var content = document.createTextNode(refresher.info.pullUpLable);

pullUpLabel.appendChild(content);

pullUp.appendChild(pullUpLabel);

scroller.appendChild(pullUp);

var pullDownEle = wrapper.querySelector(".pullDown");

var pullDownOffset = pullDownEle.offsetHeight;

var pullUpEle = wrapper.querySelector(".pullUp");

var pullUpOffset = pullUpEle.offsetHeight;

var tabname = parameter.tabname;

this.scrollIt(parameter, pullDownEle, pullDownOffset, pullUpEle, pullUpOffset);

},

scrollIt: function(parameter, pullDownEle, pullDownOffset, pullUpEle, pullUpOffset) {

eval(parameter.id + "= new iScroll(parameter.id,{useTransition: true,vScrollbar: false,topOffset: pullDownOffset,onRefresh: function () {refresher.onRelease(pullDownEle,pullUpEle);},onScrollMove: function () {refresher.onScrolling(this,pullDownEle,pullUpEle,pullUpOffset);\

if(this.y<-250 ){$('body').prepend($('#qiehuan')[0]); $('#qiehuan').addClass('fixed')}else{$('#desc').after($('#qiehuan')[0]); $('#qiehuan').removeClass('fixed')}\

},onScrollEnd: function () {refresher.onScrollEnd(pullDownEle,parameter.pullDownAction,pullUpEle,parameter.pullUpAction);}})");

},

onScrolling: function(e, pullDownEle, pullUpEle, pullUpOffset) {

if (e.y > -(pullUpOffset) && !pullDownEle.className.match('loading')) {

pullDownEle.classList.remove("flip");

pullDownEle.querySelector('.pullDownLabel').innerHTML = refresher.info.pullDownLable;

pullDownEle.querySelector('.pullDownIcon').style.display = "block";

e.minScrollY = -pullUpOffset;

}

if (e.scrollerH < e.wrapperH && e.y > e.maxScrollY - pullUpOffset && pullUpEle.className.match("flip") || e.scrollerH > e.wrapperH && e.y > e.maxScrollY - pullUpOffset && pullUpEle.className.match("flip")) {

pullUpEle.classList.remove("flip");

pullUpEle.querySelector('.pullUpLabel').innerHTML = refresher.info.pullUpLable;

}

if (e.y > 0 && !pullUpEle.className.match('loading') && !pullDownEle.className.match('loading')) {

pullDownEle.classList.add("flip");

pullDownEle.querySelector('.pullDownLabel').innerHTML = refresher.info.pullingDownLable;

e.minScrollY = 0;

}

if (e.scrollerH < e.wrapperH && e.y < (e.minScrollY - pullUpOffset) && !pullDownEle.className.match('loading') && !pullUpEle.className.match('loading') || e.scrollerH > e.wrapperH && e.y < (e.maxScrollY - pullUpOffset) && !pullDownEle.className.match('loading') && !pullUpEle.className.match('loading')) {

pullUpEle.classList.add("flip");

pullUpEle.querySelector('.pullUpLabel').innerHTML = refresher.info.pullingUpLable;

}

},

onRelease: function(pullDownEle, pullUpEle) {

if (pullDownEle.className.match('loading')) {

pullDownEle.classList.toggle("loading");

pullDownEle.querySelector('.pullDownLabel').innerHTML = refresher.info.pullDownLable;

}

if (pullUpEle.className.match('loading')) {

pullUpEle.classList.toggle("loading");

pullUpEle.querySelector('.pullUpLabel').innerHTML = refresher.info.pullUpLable;

}

},

onScrollEnd: function(pullDownEle, pullDownAction, pullUpEle, pullUpAction) {

if (pullDownEle.className.match('flip') && !pullDownEle.className.match('loading')) {

pullDownEle.classList.add("loading");

pullDownEle.classList.remove("flip");

pullDownEle.querySelector('.pullDownLabel').innerHTML = refresher.info.loadingLable;

if (pullDownAction) pullDownAction();

}

if (pullUpEle.className.match('flip') && !pullUpEle.className.match('loading')) {

pullUpEle.classList.add("loading");

pullUpEle.classList.remove("flip");

pullUpEle.querySelector('.pullUpLabel').innerHTML = refresher.info.loadingLable;

if (pullUpAction) pullUpAction();

}

}

}

上一篇下一篇

猜你喜欢

热点阅读