User:Chocohead/common.js
Jump to navigation
Jump to search
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/****************************************** * 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'); // Trim up the tooltip to avoid putting the mod name in there // Basically, remove everything after and including '(' title = title.split('(',1)[0].trim(); // 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(); }, }); });