Difference between revisions of "User:KamranMackey/common.js"
Jump to navigation
Jump to search
KamranMackey (talk | contribs) (Derp! Forgot to add all of the JS.) |
KamranMackey (talk | contribs) (Well, that was a bust. The JS didn't work. Oh well, just updated my JS to be in sync with Choco's anyway.) |
||
Line 1: | Line 1: | ||
/** | /****************************************** | ||
$ | * Tooltip Testing * | ||
*****************************************/ | |||
$(function() { | |||
var mc_tooltip = null; | |||
$(". | $(".a1, .tooltip").on({ | ||
'mouseenter.tooltip': function(e) { | |||
var $me = $(this); | |||
$ | // Make sure this isn't a link to upload a new file | ||
if ($me.find('.new').length > 0) { | |||
// This isn't one we want to show a tooltip for | |||
return; | |||
} | |||
// Try to get the title | |||
var title = $me.data('tooltip'); | |||
// See if we can find a title elsewhere | |||
// Check this element or its child | |||
if (title === undefined) { | |||
title = $me.attr('title') || $me.children(':first').attr('title'); | |||
// Check if we found anything | |||
if (title) { | |||
// Save it for later | |||
$me.data('tooltip', title); | |||
} | |||
else { | |||
// Didn't find anything, no sense continuing | |||
return; | |||
} | |||
} | |||
// Remove any title elements to avoid the default tooltip | |||
$me.add('*', $me).filter('[title]').removeAttr('title'); | |||
// Check to see if we've already created the div | |||
if (!$('#tooltip-display').length) { | |||
$('body').append('<div id="tooltip-display" />'); | |||
} | |||
mc_tooltip = $('#tooltip-display'); | |||
// Add the text to the tooltip | |||
mc_tooltip.html(title); | |||
// Need to update the position to the cursor position | |||
$me.trigger('mousemove', e); | |||
}, | |||
'mousemove.tooltip': function (e) { | |||
// Check if the element exists already, create it if it doesn't | |||
if (!$('#tooltip-display').length) { | |||
$(this).trigger('mouseenter'); | |||
return; | |||
} | |||
// Get dimensions for bounds checking | |||
var top = e.pageY - 30, | |||
height = mc_tooltip.outerHeight(true), | |||
left = e.pageX + 15, | |||
width = mc_tooltip.outerWidth(true); | |||
// Get window dimensions | |||
var $w = $(window), | |||
win_width = $w.width(), | |||
win_height = $w.height(); | |||
// TODO: Make it so it doesn't go off the sides | |||
// Apply the position | |||
mc_tooltip.css({ | |||
top: top, | |||
left: left | |||
}); | |||
}, | |||
'mouseleave.tooltip': function (e) { | |||
// Make sure the tooltip is there before we use it | |||
if (!mc_tooltip) { | |||
return; | |||
} | |||
mc_tooltip.remove(); | |||
}, | |||
}); | |||
}); | }); |
Revision as of 21:12, 21 February 2015
/****************************************** * Tooltip Testing * *****************************************/ $(function() { var mc_tooltip = null; $(".a1, .tooltip").on({ 'mouseenter.tooltip': function(e) { var $me = $(this); // Make sure this isn't a link to upload a new file if ($me.find('.new').length > 0) { // This isn't one we want to show a tooltip for return; } // Try to get the title var title = $me.data('tooltip'); // See if we can find a title elsewhere // Check this element or its child if (title === undefined) { title = $me.attr('title') || $me.children(':first').attr('title'); // Check if we found anything if (title) { // Save it for later $me.data('tooltip', title); } else { // Didn't find anything, no sense continuing return; } } // Remove any title elements to avoid the default tooltip $me.add('*', $me).filter('[title]').removeAttr('title'); // Check to see if we've already created the div if (!$('#tooltip-display').length) { $('body').append('<div id="tooltip-display" />'); } mc_tooltip = $('#tooltip-display'); // Add the text to the tooltip mc_tooltip.html(title); // Need to update the position to the cursor position $me.trigger('mousemove', e); }, 'mousemove.tooltip': function (e) { // Check if the element exists already, create it if it doesn't if (!$('#tooltip-display').length) { $(this).trigger('mouseenter'); return; } // Get dimensions for bounds checking var top = e.pageY - 30, height = mc_tooltip.outerHeight(true), left = e.pageX + 15, width = mc_tooltip.outerWidth(true); // Get window dimensions var $w = $(window), win_width = $w.width(), win_height = $w.height(); // TODO: Make it so it doesn't go off the sides // Apply the position mc_tooltip.css({ top: top, left: left }); }, 'mouseleave.tooltip': function (e) { // Make sure the tooltip is there before we use it if (!mc_tooltip) { return; } mc_tooltip.remove(); }, }); });