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';
  });
});