旋转90度看图，自动滚动
目前为
// ==UserScript==
// @name 手机看图、小说适配-旋转、缩放
// @namespace http://tampermonkey.net/
// @version 5.5
// @description 旋转90度看图，自动滚动
// @author You
// @match *://*/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=pixabay.com
// @grant none
// @require https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js
// @license MIT
// ==/UserScript==
(function() {
'use strict';
$.fn.longPress = function(fn) {
var timeout;
var $this = this;
for(var i = 0; i < $this.length; i++) {
(function(target) {
var timeout;
target.addEventListener('touchstart', function(event) {
timeout = setTimeout(function() {
//fn.apply(target);
fn(event);
}, 600);
}, false);
target.addEventListener('touchend', function(event) {
clearTimeout(timeout);
}, false);
target.addEventListener('touchmove', function(event) {
clearTimeout(timeout);
}, false);
})($this[i]);
}
};
var Dscroll = 0;
var Dxy = 0;
var timeDown;
var scrollJu = 180;
var winW;
if($(window).width() > $(window).height()){
winW=$(window).height()*0.9;
}else{
winW=$(window).width();
}
var width = winW*0.1;
var height = winW*0.075;
var top = $(window).height()*0.4 -winW*0.036;
var fontSz = winW*0.036;
var left = winW*0.125;
var jianG = winW*0.1;
var left2 = -2;
var degZ = 0;
var secZ = 2;
var scaleZ = 1;
var xMove = 0;
var twoCss = "position:absolute; top: 0; width: 100%; z-index: 2147483635!important; padding: 0; margin: 0; background-color: black;"
var aScss = "cursor: pointer; z-index: 2147483636!important; padding: 0; font-weight: bold; font-size: "+fontSz+"px !important;line-height:12px!important; border:2px solid white;height:"+height+"px;background-color:black;color:white;position:fixed;width:"+width+"px;left:0%; top: 10%; ";
var sameCss = aScss + "margin-left:" + left + "px;";
var sameCss2 = aScss + "margin-left:" + left2 + "px;";
$("body").append("<input type='button' class='JqScroll' id='Jscroll-jian' value='-' style='"+sameCss+ "px;margin-top:" + (top-jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-rotate' value='R' style='"+sameCss+ "px;margin-top:" + (top) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-jia' value='+' style='"+sameCss+ "px;margin-top:" + (top -2*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-Ju' value='" + scrollJu + "' style='"+sameCss+ "px;margin-top:" + (top -3*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-sec' value='"+secZ+"' style='"+sameCss+ "px;margin-top:" + (top-4*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-width' value='W' style='"+sameCss2+ "px;margin-top:" + (top -jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-pic' value='P' style='"+sameCss2+ "px;margin-top:" + (top -2*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-xy' value='▽' style='"+sameCss2+ "px;margin-top:" + (top -3*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-deg' value='" + degZ + "°' style='"+sameCss2+ "px;margin-top:" + (top-4*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-scale' value='" + scaleZ + "' style='"+sameCss2+ "px;margin-top:" + (top - 5*jianG) + "px'>")
.append("<input type='button' class='JqScroll' id='Jscroll-del' value='X' style='"+sameCss2+ "px;margin-top:" + (top) + "px'>")
.append("<ul id='Jscroll-ul' style='"+ twoCss + "'>");
$("body").on('click', '#Jscroll-rotate',function () {
var wrap_rotate;
var wrap_rotate_inner;
if ($('#wrap_rotate').length == 0){
wrap_rotate = $('<div />', {id: "wrap_rotate"});
wrap_rotate_inner = $('<div />', {id: "wrap_rotate_inner"});;
$('body').wrapInner(wrap_rotate_inner).wrapInner(wrap_rotate);
}else{
return
}
wrap_rotate = $('#wrap_rotate');
wrap_rotate_inner = $('#wrap_rotate_inner');
var window_width = $(window).height();
window.scrollTo(0, 3 * window_width);
setTimeout(function(){
wrap_rotate.append($(".JqScroll"));
wrap_rotate.attr('style', "overflow-y: hidden; overflow-x: auto; height: " + (window_width + 10) + "px;width:" + ($(document).height() + 100) + "px;");
wrap_rotate_inner.attr('style', "padding: 0 0 200px 0; position: relative; left: -100%; -webkit-transform: rotateZ(-90deg); -webkit-transform-origin-x: 100%; -webkit-transform-origin-y: 0%; -moz-transform: rotateZ(-90deg); -moz-transform-origin-x: 100%; -moz-transform-origin-y: 0%;float: right; width: " + window_width + "px;");
xMove = 1;
},500);
});
var fSize;
var fontZ;
var widthN = 14;
$("body").on('click', '#Jscroll-width',function () {
fSize = parseInt($(document).width() / widthN);
$("*").filter(function(index) {
return ($(this).text().length > 40 || $(this).is('p')) && $(this).has("div,a").length == 0;
}).css("background-color", "black").css("color", "white")
.css("font-size", fSize).css("line-height", "normal");
clearInterval(fontZ);
fontZ = setInterval(function () {
$("*").filter(function(index) {
return ($(this).text().length > 40 || $(this).is('p')) && $(this).has("div,a").length == 0;
}).css("background-color", "black").css("color", "white")
.css("font-size", fSize).css("line-height", "normal");
},4 * 1000);
$("#Jscroll-width").val(30 - widthN);
widthN -= 2;
if(widthN < 12){
widthN = 16
}
});
var widthZ;
var picZ = 0;
$("#Jscroll-pic").click(function () {
picZ += 1;
if (picZ % 2 != 0) {
$("#Jscroll-ul").append($("img").filter(function(index) {
return $(this).height() > 50 && $(this).width() > 50 && ($(this).attr("src")).search(/logo[^A-Za-z]/i) == -1;
}).clone().removeClass().removeAttr("id"));
$("#Jscroll-ul img").css("width","100%").css("object-fit","contain").css("padding","0").css("margin","0").css("max-height","100%").css("height","auto");
if(xMove == 1){
if($("#wrap_rotate_inner").height() < $("#Jscroll-ul").height()){
$("#wrap_rotate_inner").height($("#Jscroll-ul").height());
$("#wrap_rotate").width($("#Jscroll-ul").height());
}
}else{
if($("body").height() < $("#Jscroll-ul").height()){
$("body").height($("#Jscroll-ul").height());
}
}
$("#Jscroll-pic").css("color","green");
clearInterval(widthZ);
widthZ = setInterval(function () {
$("#Jscroll-ul").remove();
if(xMove == 1){
$("#wrap_rotate_inner").append("<ul id='Jscroll-ul' style='"+ twoCss + "'>");
}else{
$("body").append("<ul id='Jscroll-ul' style='"+ twoCss + "'>");
}
$("#Jscroll-ul").append($("img").filter(function(index) {
return $(this).height() > 50 && $(this).width() > 50 && ($(this).attr("src")).search(/logo[^A-Za-z]/i) == -1;
}).clone().removeClass().removeAttr("id"));
$("#Jscroll-ul img").css("width","100%").css("object-fit","contain").css("padding","0").css("margin","0").css("max-height","100%").css("height","auto");
if(xMove == 1){
$("#wrap_rotate_inner").height($("#Jscroll-ul").height() + 1500);
$("#wrap_rotate").width($("#Jscroll-ul").height() + 1500);
}else{
if($("body").height() < $("#Jscroll-ul").height()){
$("body").height($("#Jscroll-ul").height());
}
}
},4000);
}else{
$("#Jscroll-pic").css("color","white");
clearInterval(widthZ);
$("#Jscroll-ul").remove();
if(xMove == 1){
$("#wrap_rotate_inner").append("<ul id='Jscroll-ul' style='"+ twoCss + "'>");
}else{
$("body").append("<ul id='Jscroll-ul' style='"+ twoCss + "'>");
}
}
});
var jsSec = document.querySelector("#Jscroll-sec");
$("body").on('click', '#Jscroll-sec',function () {
secZ -= 1;
if(secZ < 0){
secZ = 4
}
if(secZ < 1){
secZ = 0.6
}
jsSec.value = secZ;
});
$("body").on('click', '#Jscroll-jia',function () {
scrollJu += 45;
$("#Jscroll-Ju").val(scrollJu);
});
var scaleTime;
$("body").on('click', '#Jscroll-deg',function () {
degZ += 90;
degZ = degZ % 360;
$("#Jscroll-deg").val(degZ + "°");
$("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
clearInterval(scaleTime);
scaleTime = setInterval(function () {
$("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
},4000);
});
$("#Jscroll-scale").longPress(function () {
scaleZ=0.56;
$("#Jscroll-scale").val(scaleZ.toFixed (2));
$("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
clearInterval(scaleTime);
scaleTime = setInterval(function () {
$("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
},4000);
});
$("body").on('click', '#Jscroll-scale',function () {
if(scaleZ ==0.56){
scaleZ = 0.9
}
scaleZ += 0.1;
if(scaleZ > 1.25){
scaleZ += 0.1
}
if(scaleZ > 1.65){
scaleZ = 0.56
}
$("#Jscroll-scale").val(scaleZ.toFixed (2));
$("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
clearInterval(scaleTime);
scaleTime = setInterval(function () {
$("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
},4000);
});
var toH;
setTimeout(function(){
toH = $(document).height() + 150;
},500);
$("body").on('click', '#Jscroll-xy',function () {
if(xMove != 1){
toH = $(document).height() + 150;
}
Dxy += 1;
if (Dxy % 2 != 0) {
if(xMove == 1){
window.scrollTo(toH,0);
}else{
window.scrollTo(0,toH);
};
$("#Jscroll-xy").val("△");
}else{
window.scrollTo(0,0)
$("#Jscroll-xy").val("▽");
}
});
$(".JqScroll").css("opacity","0.8");
var Dhide =0;
$("body").on('click', '#Jscroll-del',function () {
Dhide += 1;
if (Dhide % 2 != 0) {
$(".JqScroll").hide();
$("#Jscroll-del").show().css("opacity","0.4").css("-webkit-transform","scale(0.8)").css("-moz-transform","scale(0.8)");
}else{
$(".JqScroll").show();
$("#Jscroll-del").css("opacity","0.8").css("-webkit-transform","scale(1)").css("-moz-transform","scale(1)");
}
});
$("#Jscroll-del").longPress(function () {
setTimeout(function(){
$(".JqScroll").hide();
$("#Jscroll-del").css("opacity","0.4").css("-webkit-transform","scale(0.8)").css("-moz-transform","scale(0.8)");
if (Dhide % 2 == 0) {
Dhide +=1;
}
},100);
});
$("body").longPress(function () {
$("#Jscroll-del").show();
});
$("body").on('click', '#Jscroll-jian',function () {
scrollJu -= 45;
$("#Jscroll-Ju").val(scrollJu);
});
$("#Jscroll-Ju").longPress(function () {
scrollJu = 180;
$("#Jscroll-Ju").val(scrollJu);
});
$("body").on('click', '#Jscroll-Ju',function () {
Dscroll += 1;
if (Dscroll % 2 != 0) {
$("#Jscroll-Ju").css("color","green");
clearInterval(timeDown);
timeDown = setInterval(function () {
if(xMove ==1){
window.scrollBy(scrollJu,1)
window.scrollBy(0, -1);
}else{
window.scrollBy(0, scrollJu)
}
}, secZ * 1000);
} else {
$("#Jscroll-Ju").css("color","white");
clearInterval(timeDown);
}
});
// Your code here...
})();