php实现网页下拉刷新,html5+js下拉刷新

使用前必须导入scroller.css、iscroll.js这两个文件

部分代码：

var listdata=""; var num=1;/*测试代码*/

var myScroll,

pullDownEl, pullDownOffset,

generatedCount = 0;

function pullDownAction () {

setTimeout(function () {

/**

* 这个地方就是下拉刷新时操作，比如重新加载数据

* 外部的setTimeout 在正式环境可以去除，此处只是为了显示一个延迟的效果

*/

/*测试代码 start*/

listds = $("#newsList").html();

listdata = "

列表测试数据"+num+"

" + listds;

$("#newsList").html(listdata);

num++;

/*测试代码 end*/

myScroll.refresh();// Remember to refresh when contents are loaded (ie: on ajax completion)

}, 2000);

uexWindow.toast('0','5','刷新成功','2000');

}

function pullUpAction () {

setTimeout(function () {//

myScroll.refresh();// Remember to refresh when contents are loaded (ie: on ajax completion)

}, 1000);//

}

function loaded() {

pullDownEl = document.getElementById('pullDown');

pullDownOffset = pullDownEl.offsetHeight;

myScroll = new iScroll('wrapper', {

fixedScrollbar:false,

vScrollbar:false,

checkDOMChanges:true,

useTransition: true,

topOffset: pullDownOffset,

onRefresh: function () {

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

pullDownEl.className = '';

pullDownEl.querySelector('.pullDownLabel').innerHTML = '下拉刷新...';

}

},

onScrollMove: function () {

if (this.y > 5 && !pullDownEl.className.match('flip')) {

pullDownEl.className = 'flip';

pullDownEl.querySelector('.pullDownLabel').innerHTML = '松开刷新...';

this.minScrollY = 0;

} else if (this.y < 5 && pullDownEl.className.match('flip')) {

pullDownEl.className = '';

pullDownEl.querySelector('.pullDownLabel').innerHTML = '下拉刷新...';

this.minScrollY = -pullDownOffset;

}

},

onScrollEnd: function () {

if (pullDownEl.className.match('flip')) {

pullDownEl.className = 'loading';

pullDownEl.querySelector('.pullDownLabel').innerHTML = '正在刷新...';

pullDownAction();// Execute custom function (ajax call?)

}

}

});

setTimeout(function () { document.getElementById('wrapper').style.left = '0'; }, 800);

}

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);

html5+js下拉刷新demo下载地址：http://pan.baidu.com/s/124x4w