MediaWiki:Gadget-Tooltips.js: Difference between revisions
Jump to navigation
Jump to search
m
I think fixed the issue of position being offset due to tooltip having more lines than before, but I notice without positioning that the tooltip will not stick off screen anyway (but has its own complexities)
KokoroSenshi (talk | contribs) m (Updated top comment section) |
KokoroSenshi (talk | contribs) m (I think fixed the issue of position being offset due to tooltip having more lines than before, but I notice without positioning that the tooltip will not stick off screen anyway (but has its own complexities)) |
||
| Line 3: | Line 3: | ||
* Modified and extended by KokoroSenshi for Zelda Wiki | * Modified and extended by KokoroSenshi for Zelda Wiki | ||
*/ | */ | ||
$(function() { | $(function() { | ||
let EDGE_BUFFER = 2; // pixels | |||
$(".explain, .tooltip").bind("mouseenter", function() { | $(".explain, .tooltip").bind("mouseenter", function() { | ||
| Line 45: | Line 47: | ||
, caretMarginLeft = 0.5*(tooltipWidth - caretWidth); //TODO: Issue with half-pixels rounding; | , caretMarginLeft = 0.5*(tooltipWidth - caretWidth); //TODO: Issue with half-pixels rounding; | ||
/** Apply max-width to tooltip then update | /** Apply max-width to tooltip then update tooltip dimensions */ | ||
tooltipWidth = $tooltip | tooltipWidth = $tooltip | ||
.css("max-width", (windowWidth < 1.5*tooltipWidth) ? 0.5*windowWidth : 340 ) //TODO: 1.5 and 340 need justification and are magic numbers | .css("max-width", (windowWidth < 1.5*tooltipWidth) ? 0.5*windowWidth : 340 ) //TODO: 1.5 and 340 need justification and are magic numbers | ||
.outerWidth() | .outerWidth(); | ||
tooltipHeight = $tooltip.outerHeight(); | |||
/** Calculate default positions for tooltip (i.e. centered above the element) */ | /** Calculate default positions for tooltip (i.e. centered above the element) */ | ||
| Line 61: | Line 64: | ||
// TODO: Currently assumes the tooltip fits screen horizontally | // TODO: Currently assumes the tooltip fits screen horizontally | ||
if (screen_pos_left < 0) { | if (screen_pos_left < 0) { | ||
pos_left += | let horizontal_shift = -screen_pos_left + EDGE_BUFFER; | ||
caret_margin_left -= | pos_left += horizontal_shift; | ||
caret_margin_left -= horizontal_shift; | |||
} else if (screen_pos_right > windowWidth) { | } else if (screen_pos_right > windowWidth) { | ||
let horizontal_shift = screen_pos_right - windowWidth + EDGE_BUFFER; | |||
caret_margin_left += | pos_left -= horizontal_shift; | ||
caret_margin_left += horizontal_shift; | |||
} | } | ||