js实现自动阅读及停止功能。

本文介绍实现电子书自动阅读的功能，原理就是让滚动条一直下滚即可，停止时停止动画，switKey作为开关，防止多次点击自动阅读创建多个定时器。

html部分：

<!--自动阅读按钮-->
<div id="start" style="line-height:100px;text-align:center;right:50px;position: fixed;bottom: 400px;background: orange;width: 100px;height: 100px;color: #FFFFFF;font-size: 20px;font-weight: bold;border-radius:50%">自动翻页</div>
<div id="stop" style="line-height:100px;text-align:center;right:50px;position: fixed;bottom: 300px;background: blue;width: 100px;height: 100px;color: #FFFFFF;font-size: 20px;font-weight: bold;border-radius:50%">停止翻页</div>

js部分：

//自动阅读功能

var AutoPager = function(){
var obj = {
num : 10,
timesK : null,
start : $("#start"),
stop : $("#stop"),
switKey : true,
init : function(){
this.startClick();
this.stopClick();
},
Timer : function(){
if(this.switKey){
obj.timesK = setInterval(function(){
window.scrollBy(0,obj.num)
},100)
this.switKey = false;
}
},
clearTime : function(){
clearInterval(this.timesK);
this.switKey = true;
},
startClick : function(){
this.start.click(function(){
obj.Timer();
})
},
stopClick : function(){
this.stop.click(function(){
obj.clearTime();
})
}
}
return obj;
}

AutoPager().init()

有问题留言，我看到会第一时间回复。

昨天又优化了一下，去掉了开关，利用 null || true 返回true的原理，具体代码如下：

//自动阅读功能
var AutoPager = function(){
var obj = {
num : 10,
timesK : null,
start : $("#start"),
stop : $("#stop"),
init : function(){
this.startClick();
this.stopClick();
},
Timer : function(){
this.timesK = this.timesK || setInterval(function(){
window.scrollBy(0,obj.num)
},100)
},
clearTime : function(){
clearInterval(this.timesK);
this.timesK = null;
},
startClick : function(){
this.start.click(function(){
obj.Timer();
})
},
stopClick : function(){
this.stop.click(function(){
obj.clearTime();
})
}
}
return obj;
}
AutoPager().init()