// ==UserScript==
// @name 双击网页自动滑动,自动阅读
// @namespace https://github.com/zhchjiang95
// @version 1.0.1
// @description 屏幕自动滑动,可自定义速度,速度范围-10~10(默认速度为1),上下键实时调速度,反方向运动。
// @author zhchjiang95 <[email protected]>
// @include http://*
// @include https://*
// @require https://code.jquery.com/jquery-3.3.1.min.js
// @match http://*
// @match https://*
// @grant none
// ==/UserScript==
var box = $('<div class="move-box"><input type="number" class="move-val" value="1" title="速度"/><p class="start" title="开始/暂停">▶</p><p class="reverse" title="反方向">▼</p></div>');
$('body').append(box);
(function(){
$('.move-box').css({
'width': '40px',
'height': '90px',
'background': '#fff',
'box-shadow': '0 0 4px 0 #ccc',
'border-radius': '8px',
'overflow': 'hidden',
'position': 'fixed',
'top': '80px',
'left': '4px',
'z-index': 99999999
});
$('.move-val').css({
'width': '100%',
'height': '30px',
'padding': 0,
'color': '#000',
'border': 'none',
'outline': 'none',
'font-size': '18px',
'text-align': 'center'
})
$('.start').css({
'margin': 0,
'width': '100%',
'height': '30px',
'line-height': '30px',
'text-align': 'center',
'background': 'red',
'color': '#fff',
'font-size': '20px',
'cursor': 'pointer'
})
$('.reverse').css({
'margin': 0,
'width': '100%',
'height': '30px',
'line-height': '30px',
'text-align': 'center',
'color': '#ccc',
'cursor': 'pointer'
})
}())
var elinput = document.getElementsByClassName('move-val')[0],
elstart = document.getElementsByClassName('start')[0],
elreverse = document.getElementsByClassName('reverse')[0],
speed = 1,
timer = null,
isMove = false,
isHide = true;
elinput.oninput = function(){
if(this.value > 10){
this.value = 10;
}
if(this.value < -10){
this.value = -10;
}
if(this.value == ''){
this.value = 0;
}
speed = Number(this.value);
speed < 0 ? elreverse.innerText = '▲' : elreverse.innerText = '▼';
}
elstart.onclick = function(){
if(isMove){
this.innerText = '▶';
clearInterval(timer);
isMove = false;
isHide = true;
}else{
this.innerText = '◉';
timer = setInterval(move,20);
isMove = true;
isHide = false;
}
hideShow();
}
elreverse.onclick = function(){
speed = -speed;
speed < 0 ? this.innerText = '▲' : this.innerText = '▼';
}
function move(){
window.scrollBy(0,speed);
if($(window).height()+$(window).scrollTop()>=$(document).height()-2 || $(window).scrollTop() == 0){
elstart.innerText = '▶';
clearInterval(timer);
isMove = false;
isHide = true;
hideShow();
}
}
// 隐藏
hideShow()
function hideShow(){
if(!isHide) return;
var timer2 = null;
function hide(){
$('.move-box').stop().animate({
'left': '-30px'
},400)
}
timer2 = setTimeout(hide,2000);
$('.move-box').hover(function(){
if(!isHide) return;
clearInterval(timer2);
$(this).stop().animate({
'left': '4px'
},600)
},function(){
if(!isHide) return;
timer2 = setTimeout(hide,2000);
})
}