MediaWiki:Common.js: Difference between revisions
 Blanked the page Tags: Blanking Manual revert  | 
				No edit summary Tag: Reverted  | 
				||
| Line 1: | Line 1: | ||
document.querySelectorAll('.tooltip-cell').forEach(cell => {  | |||
  const tooltip = cell.querySelector('.tooltip-text');  | |||
  cell.addEventListener('mouseenter', (event) => {  | |||
    // Show the tooltip to calculate its position  | |||
    tooltip.style.visibility = 'visible';  | |||
    tooltip.style.opacity = '1';  | |||
    // Get the tooltip's position relative to the viewport  | |||
    const rect = tooltip.getBoundingClientRect();  | |||
    const windowHeight = window.innerHeight;  | |||
    // Adjust tooltip position if it goes off the screen  | |||
    if (rect.bottom > windowHeight) {  | |||
      tooltip.style.top = `${-10 - (rect.bottom - windowHeight)}px`;  | |||
    }  | |||
  });  | |||
  cell.addEventListener('mouseleave', () => {  | |||
    // Reset tooltip position and visibility  | |||
    tooltip.style.top = '-10px';  | |||
    tooltip.style.visibility = 'hidden';  | |||
    tooltip.style.opacity = '0';  | |||
  });  | |||
});  | |||
Revision as of 20:11, 27 October 2024
document.querySelectorAll('.tooltip-cell').forEach(cell => {
  const tooltip = cell.querySelector('.tooltip-text');
  
  cell.addEventListener('mouseenter', (event) => {
    // Show the tooltip to calculate its position
    tooltip.style.visibility = 'visible';
    tooltip.style.opacity = '1';
    // Get the tooltip's position relative to the viewport
    const rect = tooltip.getBoundingClientRect();
    const windowHeight = window.innerHeight;
    // Adjust tooltip position if it goes off the screen
    if (rect.bottom > windowHeight) {
      tooltip.style.top = `${-10 - (rect.bottom - windowHeight)}px`;
    }
  });
  cell.addEventListener('mouseleave', () => {
    // Reset tooltip position and visibility
    tooltip.style.top = '-10px';
    tooltip.style.visibility = 'hidden';
    tooltip.style.opacity = '0';
  });
});