4plebs.org - Image Hover

Greasy Fork is available in English.
4plebs.org - Image Hover

Hover over images to show the fullsize image beside the mouse cursor.
当前为 2021-11-21 提交的版本，查看最新版本。
换行

    // ==UserScript==
    // @name         4plebs.org - Image Hover
    // @namespace    http://tampermonkey.net/
    // @version      1.0
    // @description  Hover over images to show the fullsize image beside the mouse cursor.
    // @author       Gondola#7671
    // @match        https://archive.4plebs.org/*
    // @require      http://code.jquery.com/jquery-3.4.1.min.js
    // @compatible   firefox
    // @compatible   chrome
    // @run-at       document-idle
    // ==/UserScript==

    $(document).ready(function(){

        /*---START Image Hover---*/
        var mouse_offset_x = 16;
        var mouse_offset_y = 16;
        var mouse_side = false;
        var currentMousePos = { x: -1, y: -1 };


        $("body").append("<img id='img_hover_container' style='float:left; position:absolute; max-width:200px; overflow:hidden; z-index:9999;' src=''>")


        $(".thread_image_link").mouseenter(function()
        {
            $("#img_hover_container").attr("src",$(this).attr('href'))
            console.log($(this).attr('href'))
            $("#img_hover_container").css("max-height",$(window).height())
        })


        $(".thread_image_link").mouseleave(function()
        {
            $("#img_hover_container").attr("src","")
        })


        //Update Mouse Position
        $(document).mousemove(function(event)
        {
            currentMousePos.x = event.pageX;
            currentMousePos.y = event.pageY;
            update_pos();
        });


        function update_pos()
        {
            //Mouse Horizontal
            if(currentMousePos.x > ($(window).width()/2))
            {
                mouse_side = true;
                mouse_offset_x = -$("#img_hover_container").width() - 16;
                $("#img_hover_container").css("max-width", currentMousePos.x - 16)
            }
            else
            {
                mouse_side = false;
                mouse_offset_x = 16;
                $("#img_hover_container").css("max-width", $(window).width()-currentMousePos.x)
            }

            //Mouse Vertical
            if(currentMousePos.y > ($(window).height() - $("#img_hover_container").height()))
            {
                mouse_offset_y = ($(window).height() - $("#img_hover_container").height()) + $(document).scrollTop();
            }
            else
            {
                mouse_offset_y = currentMousePos.y + 16;
            }

            $("#img_hover_container").offset({
                top: mouse_offset_y,
                left: currentMousePos.x + mouse_offset_x
            });
        }


        //Update image position periodically
        var intervalID = setInterval(function(){update_pos();}, 100);

        $("#img_hover_container").css("max-height", $(window).height())
        /*---END Image Hover---*/

    });