Greasy Fork

手机看图、小说适配-旋转、缩放

旋转90度看图,自动滚动

目前为 2023-08-01 提交的版本。查看 最新版本

// ==UserScript==
// @name         手机看图、小说适配-旋转、缩放
// @namespace    http://tampermonkey.net/
// @version      0.96
// @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 = 90;

    var top = 100;

    var left = 20;

    var left2 = left - 55;

    var jianG = 40;

    var degZ = 90;

    var secZ = 4;

    var scaleZ = 0.56;

    var xMove = 0;


    var sameCss = "font-size: 14px !important;line-height:12px!important;z-index: 2147483647;border:2px solid white;height:25px;background-color:black;color:white;position:fixed;width:40px;left:10%; top:15%; margin-left:" + left + "px;";
    var sameCss2 = "font-size: 14px !important;line-height:12px!important;z-index: 2147483647;border:2px solid white;height:25px;background-color:black;color:white;position:fixed;width:40px;left:10%; top:15%; margin-left:" + left2 + "px;";

    $("body").append("<input type='button' class='JqScroll' id='Jscroll-jian' value='-' style='"+sameCss+ "px;margin-top:" + (top+3*jianG) + "px'>")
        .append("<input type='button' class='JqScroll' id='Jscroll-rotate' value='R' style='"+sameCss+ "px;margin-top:" + (top+4*jianG) + "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 + jianG) + "px'>")

        .append("<input type='button' class='JqScroll' id='Jscroll-sec' value='"+secZ+"' style='"+sameCss2+ "px;margin-top:" + (top) + "px'>")
        .append("<input type='button' class='JqScroll' id='Jscroll-width' value='W' style='"+sameCss2+ "px;margin-top:" + (top + 4*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 + 2*jianG) + "px'>")
        .append("<input type='button' class='JqScroll' id='Jscroll-scale' value='" + scaleZ + "' style='"+sameCss2+ "px;margin-top:" + (top + jianG) + "px'>")
        .append("<input type='button' class='JqScroll' id='Jscroll-del' value='X' style='"+sameCss+ "px;margin-top:" + (top) + "px'>");

    $("#Jscroll-rotate").click(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 body_height = $('body').width();

        var window_width = $(window).height();

        window.scrollTo(0, 3 * window_width);

        setTimeout(function(){

            body_height += 15; // for the scrollbar

            wrap_rotate.append($(".JqScroll"));

            wrap_rotate.attr('style', "overflow-y: hidden; overflow-x: auto; height: " + (window_width + 4) + "px;width:" + ($(document).height() + 150) + "px;");

            wrap_rotate_inner.attr('style', "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;");

            setInterval(function () {
                window.scrollBy(0, 1);
                window.scrollBy(0, -1);
            }, 1000);

            xMove = 1;
            $("#Jscroll-jia").click();
            $("#Jscroll-sec").click();
        },500);
    });

    var fSize = 0;
    var fontZ;
    $("#Jscroll-width").click(function(){
        if (fSize == 0){
            fSize = parseInt($("body").width() / 14);
        }
        $("*").filter(function(index) {
            return $(this).text().length > 50;
        }).css("background-color", "black").css("color", "white")
            .css("font-size", fSize);


        clearInterval(fontZ);
        fontZ = setInterval(function () {

            $("*").filter(function(index) {
                return $(this).text().length > 50;
            }).css("background-color", "black").css("color", "white")
                .css("font-size", fSize);

        },4 * 1000);

    });



    $("#Jscroll-sec").click(function () {
        secZ -= 1;
        if(secZ < 1){
            secZ = 4
        }
        $("#Jscroll-sec").val(secZ);

    });

    $("#Jscroll-jia").click(function () {

        scrollJu += 45;
        $("#Jscroll-Ju").val(scrollJu);

    });
    $("#Jscroll-deg").click(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+")");


    });

    $("#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+")");

    });
    $("#Jscroll-scale").click(function () {
        if(scaleZ > 0.9 && scaleZ < 1.1){
            scaleZ += 0.01
        }
        if(scaleZ > 0.6){
            scaleZ -= 0.11
        }

        scaleZ -= 0.04;

        if(scaleZ < 0.38){
            scaleZ = 1.15
        }

        $("#Jscroll-scale").val(scaleZ.toFixed (2));
        $("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");

    });

    var toH;
    setTimeout(function(){
        toH = $(document).height() + 150;
    },500);

    $("#Jscroll-xy").click(function () {

        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");

    $("body").longPress(function () {
        $(".JqScroll").show();

    });

    $("body").dblclick(function () {
        $(".JqScroll").show();
    });

    $("#Jscroll-del").click(function () {

        $(".JqScroll").hide();
    });

    $("#Jscroll-jian").click(function () {

        scrollJu -= 45;

        $("#Jscroll-Ju").val(scrollJu);

    });

    $("#Jscroll-Ju").click(function () {

        Dscroll += 1;

        if (Dscroll % 2 != 0) {
            $("#Jscroll-Ju").css("color","green");

            if (scrollJu < 140 && xMove != 1) {
                $("img").css("-webkit-transform","rotate("+degZ+"deg) scale("+scaleZ+")").css("-moz-transform","rotate("+degZ+"deg) scale("+scaleZ+")");
            }

            timeDown = setInterval(function () {
                if(xMove ==1){
                    window.scrollBy(scrollJu,0)
                }else{
                    window.scrollBy(0, scrollJu)
                }

            }, secZ * 1000)

        } else {
            $("#Jscroll-Ju").css("color","white");

            clearInterval(timeDown)

            if (scrollJu < 140 && xMove != 1) {
                $("img").css("-webkit-transform","rotate(0deg) scale(1)").css("-moz-transform","rotate(0deg) scale(1)");
            }

        }

    });
    // Your code here...
})();