☰

InstaZoom

Show actual size image when clicking on it

当前为 2017-09-29 提交的版本，查看 最新版本。

// ==UserScript==
// @name         InstaZoom
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  Show actual size image when clicking on it
// @icon         https://instagramstatic-a.akamaihd.net/h1/images/ico/favicon.ico/dfa85bb1fd63.ico
// @author       nljuggler
// @match        https://*.instagram.com/*
// @grant        unsafeWindow
// @require      https://code.jquery.com/jquery-2.2.4.js
// ==/UserScript==

$(function(){
    console.log('Running...');
    createLightbox();
    $(document).on("click","._si7dy, ._4rbun", function() {
        console.log('click');
        var $otherDiv = $(this).parent().find('._4rbun');
        console.log($otherDiv.find('img').attr('src'));
        $('body').find('#nljugglerLightbox #lightboxImage').attr('src', $otherDiv.find('img').attr('src'));
        $('#nljugglerLightbox').show();
        if ($(this).hasClass("_si7dy")){
            $(this).remove();
        }
    });

    $('#lightboxImage').click(function() {
        $(this).parent().hide();
    });

    function createLightbox(){
        var lightbox = "<div id='nljugglerLightbox' style='position: fixed; top: 10px; left: 50%;transform: translateX(-50%); max-height:900px; z-index:100; overflow:auto; border:solid 2px black;'><img id='lightboxImage' width='100%' /></div>";
        $('body').append(lightbox);
    }
});