बुझते पल: युवा जीवन की प्रेरक कहानियाँ – सच्चाई, संघर्ष और सफलता!

// Wait for the DOM content to load before executing the code document.addEventListener("DOMContentLoaded", function() { // Handle the "Next Part" button animation (scale effect) const nextPartButtons = document.querySelectorAll(".custom-a"); nextPartButtons.forEach(button => { button.addEventListener("mouseenter", () => { button.style.transform = "scale(1.1)"; button.style.transition = "transform 0.3s ease"; // Only transition transform }); button.addEventListener("mouseleave", () => { button.style.transform = "scale(1)"; }); }); // Shimmer Effect for Header (Applied via CSS animation now) // const shimmerEffect = () => { // const shimmerElements = document.querySelectorAll(".custom-h2"); // shimmerElements.forEach(element => { // element.style.animation = "custom-shimmer 2s infinite linear"; // Use linear for smoother shimmer // }); // } // shimmerEffect(); // Call if needed, but CSS handles it for .custom-h2 // Text Hover Effect for Paragraph const paragraphElements = document.querySelectorAll(".custom-p"); const defaultParagraphColor = getComputedStyle(document.documentElement).getPropertyValue('--main-text-color').trim() || "#4f2c1f"; // Get default from CSS variable or fallback const hoverParagraphColor = getComputedStyle(document.documentElement).getPropertyValue('--deep-pink-hover').trim() || "#C71585"; // Get hover color from CSS variable or fallback paragraphElements.forEach(paragraph => { paragraph.addEventListener("mouseover", () => { paragraph.style.color = hoverParagraphColor; // Use deep pink color from variable paragraph.style.textShadow = "1px 1px 3px rgba(0, 0, 0, 0.2)"; // Subtle shadow on hover }); paragraph.addEventListener("mouseout", () => { paragraph.style.color = defaultParagraphColor; // Revert to default color paragraph.style.textShadow = "none"; }); }); // SlideUp Animation for Post Containers (Applied via CSS animation now) // const postContainers = document.querySelectorAll(".custom-div"); // postContainers.forEach(container => { // container.style.animation = "custom-slideUp 1.5s ease-in-out"; // }); // CSS handles this with .post-container directly // Hover Effects for Images const images = document.querySelectorAll(".custom-image"); images.forEach(image => { image.addEventListener("mouseenter", () => { image.style.transform = "scale(1.05)"; image.style.transition = "transform 0.3s ease"; // Only transition transform }); image.addEventListener("mouseleave", () => { image.style.transform = "scale(1)"; }); }); // Smooth Scroll to Next Part const nextPartLinks = document.querySelectorAll(".custom-a[href^='#']"); // Target only internal links nextPartLinks.forEach(link => { link.addEventListener("click", (event) => { event.preventDefault(); const targetId = link.getAttribute("href"); const nextSection = document.querySelector(targetId); if (nextSection) { // Calculate offset considering potential fixed header if any (adjust -50 if needed) const offsetTop = nextSection.getBoundingClientRect().top + window.pageYOffset - 50; window.scrollTo({ top: offsetTop, behavior: 'smooth' }); } }); }); // --- Updated Section for Special Text --- // Select all special text elements const specialTextElements = document.querySelectorAll(".special-text-1, .special-text-2, .special-text-3"); // Automatic Scroll slightly on Hover (Optional - can be distracting) /* specialTextElements.forEach(element => { element.addEventListener("mouseover", () => { // Subtle scroll, may not be desired by all users // window.scrollBy({ top: 30, left: 0, behavior: 'smooth' }); }); }); */ // TTS (Text-to-Speech) Functionality for Special Text if ('speechSynthesis' in window) { specialTextElements.forEach(element => { element.addEventListener("click", () => { // Stop any previous speech first window.speechSynthesis.cancel(); // Create new utterance const textToSpeak = element.textContent; const speech = new SpeechSynthesisUtterance(textToSpeak); // Try to find a Hindi voice if available let voices = window.speechSynthesis.getVoices(); let hindiVoice = voices.find(voice => voice.lang.startsWith('hi')); // Find any Hindi voice if (hindiVoice) { speech.voice = hindiVoice; } else { // Fallback if no specific Hindi voice, browser might pick one speech.lang = "hi-IN"; } speech.pitch = 1; // Normal pitch speech.rate = 0.9; // Slightly slower rate for clarity speech.volume = 1; // Full volume window.speechSynthesis.speak(speech); }); }); // Ensure voices are loaded (important for some browsers) if (window.speechSynthesis.onvoiceschanged !== undefined) { window.speechSynthesis.onvoiceschanged = () => { // Re-check for voices if needed, though the initial check inside the click handler often works }; } } else { console.log("Sorry, your browser does not support Text-to-Speech."); // Optionally disable the cursor:pointer on special text if TTS is not supported specialTextElements.forEach(el => el.style.cursor = 'default'); } // Mobile View Adjustments (CSS handles font size via media query now) // if (window.innerWidth <= 768) { // const mobileButtons = document.querySelectorAll(".custom-a"); // mobileButtons.forEach(button => { // button.style.fontSize = "16px"; // Use CSS media queries for this // }); // } });