Difference between revisions of "MediaWiki:Common.js"
From Unofficial Fantasica Wiki
Line 22: | Line 22: | ||
$("td.preview").hover(function(e){ | $("td.preview").hover(function(e){ | ||
− | $("body").append("<div id='preview'></div>"); | + | $("body").append("<div id='preview'><img src='"+this.title+"' alt='Image preview' /></div>"); |
$("#preview") | $("#preview") | ||
− | |||
.css("top",(e.pageY - xOffset) + "px") | .css("top",(e.pageY - xOffset) + "px") | ||
.css("left",(e.pageX + yOffset) + "px") | .css("left",(e.pageX + yOffset) + "px") |
Revision as of 03:56, 4 January 2013
/* Any JavaScript here will be loaded for all users on every page load. */ /* * Image preview script * powered by jQuery (http://www.jquery.com) * * written by Alen Grakalic (http://cssglobe.com) * * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery * */ this.imagePreview = function(){ /* CONFIG */ xOffset = 10; yOffset = 30; // these 2 variable determine popup's distance from the cursor // you might want to adjust to get the right result /* END CONFIG */ $("td.preview").hover(function(e){ $("body").append("<div id='preview'><img src='"+this.title+"' alt='Image preview' /></div>"); $("#preview") .css("top",(e.pageY - xOffset) + "px") .css("left",(e.pageX + yOffset) + "px") .fadeIn("fast"); }, function(){ this.title = this.t; $("#preview").remove(); }); $("td.preview").mousemove(function(e){ $("#preview") .css("top",(e.pageY - xOffset) + "px") .css("left",(e.pageX + yOffset) + "px"); }); }; // starting the script on page load $(document).ready(function(){ imagePreview(); });