您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Adds inline image expansion to 4chan archives.
当前为
// ==UserScript== // @name 4chan Archive Image Expander // @description Adds inline image expansion to 4chan archives. // @author Hen Tie // @homepage http://hen-tie.tumblr.com/ // @namespace https://greasyfork.org/en/users/8336 // @include /https?:\/\/(desuarchive.org|archived.moe)\/.*\/thread\/.*/ // @grant none // @require https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js // @require https://greasyfork.org/scripts/39415-jquery-initialize/code/jQuery%20Initialize.js?version=258071 //// @icon URL // @version 1.4 // ==/UserScript== $(function () { $.initialize('.init', function() { $(this).parent().removeClass('spinner'); }); $('<style>.spinner:before{content:"";box-sizing:border-box;position:absolute;top:50%;left:50%;width:20px;height:20px;margin-top:-10px;margin-left:-10px;border-radius:50%;border-top:2px solid #CCC;border-right:2px solid transparent;animation:spinner 0.6s linear infinite}@keyframes spinner{to{transform:rotate(360deg)}}</style>').appendTo('head'); //video settings var vidAttr = 'loop autoplay controls'; var imgCSS = { 'max-width': '100%', 'height': 'auto' }; var webmCSS = { 'max-width': '100%', 'height': 'auto' }; //indicate webm thumbnail $('.post_file_filename[href$=".webm"]').parent().next().find('.post_image').css('border', '3px solid #5f89ac'); //prevent weird wrapping around expanded images $('.theme_default .post header').css('display', 'inline-block'); $('.thread_image_box a').on('click', function (e) { var myHref = $(this).attr('href'); var myHeight = $(this).children('img').outerHeight(); var myWidth = $(this).children('img').outerWidth(); $(this).parent().addClass('spinner').css({ 'min-height': myHeight, 'min-width': myWidth, 'position': 'relative' }); //new elements containing full size href as src var img = $('<img />').attr({ 'src': myHref, 'class': 'openItem' }).css(imgCSS).load(function(){ $(this).addClass('init'); }); var webm = $('<video ' + vidAttr + ' id="vid"><source type="video/webm" src="' + myHref + '"/></video>').attr('class', 'openItem').css(webmCSS); //check filetype, hide thumbnail, insert full size file if (myHref.match(/.gif$|.png$|.jpg$/g)) { e.preventDefault(); $(this).fadeTo('fast', 0, function () { $(this).hide(); $(this).after(img); }); } else if (myHref.match(/.webm$/g)) { e.preventDefault(); $(this).hide(); $(this).after(webm); var vid = document.getElementById("vid"); vid.onloadeddata = function() { $(this).addClass('init'); }; } else { console.log('"4chan Archive Image Expander"\nUnsupported filetype, please report.\nSee @homepage or @namespace for contact info.'); } }); //on reclick, remove full size, show thumbnail again $(document).on('click', '.openItem', function () { $(this).prev().show().fadeTo(0, 1); $(this).remove(); }); });