Dwumadzinyi:Takovej normální týpek/common.js

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)
Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

document.addEventListener('DOMContentLoaded', function() {
    // Přidání futuristické funkce pro vyhledávání
    const searchForm = document.querySelector('form');
    const searchInput = searchForm.querySelector('input[type="search"]');

    searchInput.addEventListener('focus', () => {
        searchInput.style.boxShadow = '0px 0px 10px #1a73e8';
        searchInput.style.transition = 'box-shadow 0.3s ease';
    });

    searchInput.addEventListener('blur', () => {
        searchInput.style.boxShadow = 'none';
    });

    // Navigační lišta dynamicky reaguje na scroll
    const nav = document.getElementById('p-navigation');
    window.addEventListener('scroll', () => {
        if (window.scrollY > 200) {
            nav.style.boxShadow = '0px 4px 10px rgba(0, 0, 0, 0.3)';
        } else {
            nav.style.boxShadow = 'none';
        }
    });

    // Tlačítka s animací
    const buttons = document.querySelectorAll('button, .button');
    buttons.forEach(button => {
        button.addEventListener('mouseenter', () => {
            button.style.transform = 'scale(1.05)';
        });
        button.addEventListener('mouseleave', () => {
            button.style.transform = 'scale(1)';
        });
    });

    // Efekt při hoveru na obrázky
    const images = document.querySelectorAll('img');
    images.forEach(image => {
        image.addEventListener('mouseenter', () => {
            image.style.filter = 'brightness(120%)';
            image.style.transition = 'filter 0.3s ease';
        });

        image.addEventListener('mouseleave', () => {
            image.style.filter = 'brightness(100%)';
        });
    });

    // Dynamický efekt fade-in na články
    const content = document.getElementById('content');
    content.classList.add('fade-in');
});

// Funkce pro dynamické zobrazení patičky při scrollování
function toggleFooter() {
    const footer = document.querySelector('footer');
    if (window.scrollY > 100) {
        footer.style.opacity = 1;
        footer.style.transition = 'opacity 0.5s ease';
    } else {
        footer.style.opacity = 0;
    }
}

window.addEventListener('scroll', toggleFooter);