Snippets library

Browse Snippets
Claim your Free Profile
Add Snippet

Location: site_wide_header

Fading Page Transitions

document.addEventListener(“DOMContentLoaded”, function() { // Create and insert CSS styles for fade-in and fade-out const style = document.createElement(‘style’); style.innerHTML = ` .fade-out { opacity: 0; transition: opacity 0.5s ease-in-out; } .fade-in { opacity: 1; transition: opacity 0.5s ease-in-out; } `; document.head.appendChild(style);…Continue reading

Smooth Scrolling for Anchor Links

document.addEventListener(‘click’, function(e) { // Check if the clicked element is an anchor with href starting with ‘#’ if (e.target.tagName === ‘A’ && e.target.getAttribute(‘href’) && e.target.getAttribute(‘href’).startsWith(‘#’)) { e.preventDefault(); const targetId = e.target.getAttribute(‘href’).slice(1); // Remove the ‘#’ from the href const targetElement…Continue reading