MediaWiki:Common.js: Difference between revisions
From LOTR-TCG Wiki
(Created page with "→Any JavaScript here will be loaded for all users on every page load.: var tooltips = document.querySelectorAll('.tooltip span'); window.onmousemove = function (e) {...") |
(Hopefully fixing tooltip images from shrinking instead of adjusting their position when too close to the bottom/right) |
||
| Line 3: | Line 3: | ||
window.onmousemove = function (e) { | window.onmousemove = function (e) { | ||
var | var xoffset = (e.clientX + 20), | ||
yoffset = (e.clientY + 20); | |||
for (var i = 0; i < tooltips.length; i++) { | for (var i = 0; i < tooltips.length; i++) { | ||
tooltips[i].style.top = y; | var x = xoffset, y = yoffset; | ||
tooltips[i].style.left = x; | |||
var tooltip_rect = tooltips[i].getBoundingClientRect(); | |||
if ((tooltip_rect.x + tooltip_rect.width) > window.innerWidth) // Out on the right | |||
x = -tooltip_rect.width - 5; // Simulate a "right: tipX" position | |||
if ((tooltip_rect.y + tooltip_rect.height) > window.innerHeight) // Out on the bottom | |||
y = -tooltip_rect.height - 5 // Align on the top | |||
tooltips[i].style.top = y + 'px'; | |||
tooltips[i].style.left = x + 'px'; | |||
} | } | ||
}; | }; | ||
Revision as of 20:05, 28 September 2021
/* Any JavaScript here will be loaded for all users on every page load. */
var tooltips = document.querySelectorAll('.tooltip span');
window.onmousemove = function (e) {
var xoffset = (e.clientX + 20),
yoffset = (e.clientY + 20);
for (var i = 0; i < tooltips.length; i++) {
var x = xoffset, y = yoffset;
var tooltip_rect = tooltips[i].getBoundingClientRect();
if ((tooltip_rect.x + tooltip_rect.width) > window.innerWidth) // Out on the right
x = -tooltip_rect.width - 5; // Simulate a "right: tipX" position
if ((tooltip_rect.y + tooltip_rect.height) > window.innerHeight) // Out on the bottom
y = -tooltip_rect.height - 5 // Align on the top
tooltips[i].style.top = y + 'px';
tooltips[i].style.left = x + 'px';
}
};