User:Jrajav/myskin.js

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

/*jslint regexp: true, browser: true */
/*global $: false */

var iWantThumbnailPreviews = true,
    andAnimateThem = true, // Doesn't perform that well in most browsers yet
    andPreloadThem = true;

$(function () {
	'use strict';

	if (iWantThumbnailPreviews) {
		$('div.tright, div.tleft').each(function () {
			var self = $(this),
                originalImage = $(this).find('img').first(),
				originalImageWidth = originalImage.width(),
				overlayAnchor = $('<a/>'),
				overlayImage = $('<img/>'),
				loadOverlay;

            var resize = function () {
                overlayImage.css(
					self.is('.tright')
						//? { 'right': ($(window).width() - (originalImage.offset().left + originalImageWidth)) + 'px' }
						//: { 'left': originalImage.offset().left + 'px' }
                        ? { 'right': '0px' }
                        : { 'left': '0px' }
                );
            };
 
			overlayImage
				.css({
					'position': 'absolute',
					//'top': originalImage.offset().top + 'px',
					'max-width': originalImageWidth + 'px'
				})
				.load(function () {
					overlayAnchor.show();
					overlayImage.addClass('jrajav-image-overlay');
					if (andAnimateThem) {
						overlayImage.addClass('jrajav-image-overlay-animate');
					}
				});
 
            resize();
 
            $(window).resize(function () {
                resize();
            });

			overlayAnchor
				.hide()
				.attr('href', $(this).find('a').first().attr('href'))
				.append(overlayImage);

			$(this).prepend(overlayAnchor);

			loadOverlay = function () {
				overlayImage.attr('src', originalImage.attr('src').replace('/thumb/', '/').replace(/\/\d*px.*$/, ''));
			};

			if (andPreloadThem) {
				loadOverlay();
			} else {
				originalImage.one('mouseenter', loadOverlay);
			}
		});
	}

	$('#searchInput').attr('tabindex', 1);
});