47 lines
1.4 KiB
JavaScript
47 lines
1.4 KiB
JavaScript
|
/**
|
||
|
|
* Footer and Button Bar Interaction
|
||
|
|
* Makes button bar semi-transparent when hovering over footer area
|
||
|
|
* so footer content remains visible
|
||
|
|
*/
|
||
|
|
|
||
|
|
(function() {
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
// Wait for DOM to be ready
|
||
|
|
if (document.readyState === 'loading') {
|
||
|
|
document.addEventListener('DOMContentLoaded', init);
|
||
|
|
} else {
|
||
|
|
init();
|
||
|
|
}
|
||
|
|
|
||
|
|
function init() {
|
||
|
|
const footer = document.querySelector('footer.no-print');
|
||
|
|
if (!footer) return;
|
||
|
|
|
||
|
|
// Get all fixed buttons
|
||
|
|
const buttons = document.querySelectorAll(
|
||
|
|
'.download-btn, .print-friendly-btn, .shortcuts-btn, ' +
|
||
|
|
'.info-button, .back-to-top, .color-theme-switcher'
|
||
|
|
);
|
||
|
|
|
||
|
|
// Add hover listeners to footer
|
||
|
|
footer.addEventListener('mouseenter', () => {
|
||
|
|
// Add class to footer itself for text enlargement
|
||
|
|
footer.classList.add('footer-hovered');
|
||
|
|
// Add class to buttons for transparency
|
||
|
|
buttons.forEach(btn => {
|
||
|
|
btn.classList.add('footer-hovered');
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
footer.addEventListener('mouseleave', () => {
|
||
|
|
// Remove class from footer
|
||
|
|
footer.classList.remove('footer-hovered');
|
||
|
|
// Remove class from buttons
|
||
|
|
buttons.forEach(btn => {
|
||
|
|
btn.classList.remove('footer-hovered');
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
})();
|