LinkPreview shows article preview on link hover. Inspired by mw:extension:Popups.

Installation

Importing multiple scripts? This quick guide shows how to combine the imports.
  • For site-wide use, an administrator can add the line below to the wiki's MediaWiki:ImportJS page.
dev:LinkPreview/code.js
  • For personal use, add the code snippet below to your global.js page (for use on all wikis) or your common.js page on your wiki (for use on a single wiki). Note that personal JS must be enabled for your account.
importArticles({
    type: 'script',
    articles: [
        'u:dev:MediaWiki:LinkPreview/code.js',
    ]
});

Settings

Available through window.pPreview.

Create configuration object (do it at first)
window.pPreview = $.extend(true, window.pPreview, {RegExp: (window.pPreview || {}).RegExp || {} });
  • csize : 100 - cache size. Example: window.pPreview.csize = 100;
  • debug : false - debug mode, verbose output. Also available as &debug=1. Example: window.pPreview.debug = true;
  • apid : false - use api to retrieve data. Faster (only one request performed), but obeys image restrictions (too small images will not be used to build preview). Example: window.pPreview.apid = true;
  • defimage : - default image source (before article image loaded). Example: window.pPreview.defimage = 'https://wikia.nocookie.net/someimage';
  • noimage : - image-not-found source. Example: same as defimage.
  • delay : 100 - hover reaction delay. Example: window.pPreview.delay = 100;
  • dock : '#mw-content-text, #article-comments' - article container. Example: window.pPreview.dock = '#mw-content-text';
  • fixContentHook : true - ensure #mw-content-text (article content) was processed.
  • scale : {r: '?', t: '/scale-to-width-down/350?'} - replace r to t in the img src (vignette-based scaling). Use scale=false if no scaling nedeed. Example: window.pPreview.scale = {r: '?', t: '/scale-to-width-down/350?'};
  • tlen : 1000 - max text length. Example: window.pPreview.tlen = 1000;
  • wholepage : false - parse whole page instead of section 0. Also available as &wholepage=1. Example: window.pPreview.wholepage = true;
  • RegExp.iimages : [] - array of RegExp or plain text. Ignored images, will not be used to build preview. Example: window.pPreview.RegExp.iimages = [/myimage\.png/, new RegExp('myim.*'), 'some text'];
  • RegExp.ipages : [] - array of RegExp or plain text. Ignored pages, preview will not show up. Example: same as iimages.
  • RegExp.ilinks : [] - array of RegExp or plain text. Ignored links, will have not preview on it. Example: same as iimages.
  • RegExp.iclasses : [] - array of strings. Ignored classes, links with these classes will have not preview on it. window.pPreview.RegExp.iclasses = ['myclass1', 'myclass2'];
  • RegExp.iparents : ['[id^=flytabs]'] - array of strings (jQuery/DOM objects are permitted, but not tested). Ignored parent elements, children links of these elements will have not preview on it. By default, tabviews are ignored. window.pPreview.RegExp.iparents = ['.myclass', '#myid', 'div[data-ignore-me=1]'];.
  • RegExp.onlyinclude : [] - array of strings (jQuery/DOM objects are permitted, but not tested). Selector to include. If selector found, then other content will be ignored. Example: window.pPreview.RegExp.onlyinclude = ['.myclass', '#myid', '[data-include-me=1]'];

Mega example

window.pPreview = $.extend(true, window.pPreview, {RegExp: (window.pPreview || {}).RegExp || {} });
window.pPreview.defimage = 'https://vignette.wikia.nocookie.net/borderlands/images/0/05/Ajax.gif/revision/latest/scale-to-width-down/350?cb=20170626182120&path-prefix=ru';
window.pPreview.noimage = 'https://vignette.wikia.nocookie.net/borderlands/images/f/f5/%D0%97%D0%B0%D0%B3%D0%BB%D1%83%D1%88%D0%BA%D0%B0.png/revision/latest/scale-to-width-down/200?cb=20160122074659&path-prefix=ru';
window.pPreview.tlen = 1000;
window.pPreview.RegExp.iparents = ['.myclass', '#myid', 'div[data-ignore-me=1]'];

Addons

newpages.js
adds preview button to Special:NewPages elements. Preview will shown up on the upper-left corner.

Demo

Hover the mouse over the links:

Community content is available under CC-BY-SA unless otherwise noted.