MediaWiki:Common.js: Difference between revisions
From LOTR-TCG Wiki
No edit summary |
No edit summary |
||
| Line 6: | Line 6: | ||
yoffset = (e.clientY + 20); | yoffset = (e.clientY + 20); | ||
for (var i = 0; i < tooltips.length; i++) { | for (var i = 0; i < tooltips.length; i++) { | ||
var tooltip_rect = tooltips[i].getBoundingClientRect(); | var tooltip_rect = tooltips[i].getBoundingClientRect(); | ||
if(tooltip_rect.width == 0) | if(tooltip_rect.width == 0) | ||
continue; | continue; | ||
var x = xoffset, y = yoffset; | |||
console.log(tooltip_rect); | // console.log(tooltip_rect); | ||
console.log("Width: " + window.innerWidth); | // console.log("Width: " + window.innerWidth); | ||
console.log("Height: " + window.innerHeight); | // console.log("Height: " + window.innerHeight); | ||
console.log("X: " + x); | // console.log("X: " + x); | ||
console.log("Y: " + y); | // console.log("Y: " + y); | ||
if (( | if ((xoffset + tooltip_rect.width) > window.innerWidth) // Out on the right | ||
x = window.innerWidth - tooltip_rect.width; | x = window.innerWidth - tooltip_rect.width; | ||
if (( | if ((yoffset + tooltip_rect.height) > window.innerHeight) // Out on the bottom | ||
y = window.innerHeight - tooltip_rect.height; | y = window.innerHeight - tooltip_rect.height; | ||
console.log("X: " + x); | // console.log("X: " + x); | ||
console.log("Y: " + y); | // console.log("Y: " + y); | ||
tooltips[i].style.top = y + 'px'; | tooltips[i].style.top = y + 'px'; | ||
tooltips[i].style.left = x + 'px'; | tooltips[i].style.left = x + 'px'; | ||
} | } | ||
}; | }; | ||
Revision as of 00:09, 30 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 tooltip_rect = tooltips[i].getBoundingClientRect();
if(tooltip_rect.width == 0)
continue;
var x = xoffset, y = yoffset;
// console.log(tooltip_rect);
// console.log("Width: " + window.innerWidth);
// console.log("Height: " + window.innerHeight);
// console.log("X: " + x);
// console.log("Y: " + y);
if ((xoffset + tooltip_rect.width) > window.innerWidth) // Out on the right
x = window.innerWidth - tooltip_rect.width;
if ((yoffset + tooltip_rect.height) > window.innerHeight) // Out on the bottom
y = window.innerHeight - tooltip_rect.height;
// console.log("X: " + x);
// console.log("Y: " + y);
tooltips[i].style.top = y + 'px';
tooltips[i].style.left = x + 'px';
}
};