Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
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';
  });
});