Bootstrap

iscroll的基本方法


// 创建滚动视图
var myScroll = new IScroll('.content', {
// bounceEasing: 'elastic', bounceTime: 1200

//常用配置项
//弹簧效果
bounce: true,

//打开点击事件
//为了系统更优默认click事件为false,统一为滚动事件
//如果想页面的点击事件和a标签链接生效的话必须让click和tap都设置为true;
click: true,
tap: true,

//支持鼠标滚动
mouseWheel: true,

//显示滚动条
scrollbars: true,
//滚动条淡入淡出
fadeScrollbars: true,

//x,y轴是否可以滚动
scrollX: true,
scrollY: true,

//自由滚动,精确手指的运动(X,Y轴都会偏移),值为false时只会根据X,Y轴谁偏移的多就向哪方滚
freeScroll: true,

//x,y轴设置起始位置
startX: 0,
startY: 0,

//配置侦听滚动事件的方式(需要换成引入iscroll-probe.js)
probeType: 3//可取值:1,2,3
//1,scroll执行缓慢,惯性的滚动不执行
//2,scroll执行较快,惯性的滚动不执行
//3,scroll执行较快,惯性的滚动执行
});


function testAction(){
//iscroll常用属性

// myScroll.wrapper 滚动容器的dom对象
// myScroll.scroller 滚动视图的dom对象

//x,y轴最大滚动范围
// myScroll.maxScrollX
// myScroll.maxScrollY

// 当前滚动视图所在位置
// myScroll.x
// myScroll.y

console.log(myScroll);


//iscroll常用的方法
//滚动到指定的位置
// myScroll.scrollTo(x, y, speed);
// myScroll.scrollTo(0, -200, 500);
//myScroll.scrollBy(0, -200, 500)每次都会走你设定的距离(数据会叠加)

//更新滚动视图
// myScroll.refresh();

}




// iscroll的滚动事件
//滚动开始前
myScroll.on('beforeScrollStart', function(){
console.log('beforeScrollStart');
});
//滚动开始
myScroll.on('scrollStart', function(){
console.log('scrollStart');
});
//正在滚动
myScroll.on('scroll', function(){
console.log('scroll');

});
// 滚动停止
myScroll.on('scrollEnd', function(){
console.log('scrollEnd');
});
// 滚动取消,触发条件跟touchcancel一样(手机放弃活跃状态的时候,比如你收到短信)
myScroll.on('scrollCancel', function(){
console.log('scrollCancel');
});

转载于:https://www.cnblogs.com/tc-jieke/p/9242158.html

;