Spaces:
Running
Running
| // Initialize tooltips | |
| document.addEventListener('DOMContentLoaded', () => { | |
| // Add any interactive elements here | |
| const buttons = document.querySelectorAll('button'); | |
| buttons.forEach(button => { | |
| button.addEventListener('mouseenter', () => { | |
| button.classList.add('glow'); | |
| }); | |
| button.addEventListener('mouseleave', () => { | |
| button.classList.remove('glow'); | |
| }); | |
| }); | |
| // Rainbow text effect for h1 | |
| const rainbowText = document.querySelector('h1'); | |
| if (rainbowText) { | |
| rainbowText.innerHTML = rainbowText.textContent.split('').map((char, i) => | |
| `<span style="animation: rainbow 8s linear infinite ${i * 0.1}s;">${char}</span>` | |
| ).join(''); | |
| } | |
| }); | |
| // Add rainbow animation to style dynamically | |
| const style = document.createElement('style'); | |
| style.textContent = ` | |
| @keyframes rainbow { | |
| 0% { color: #ff0000; } | |
| 14% { color: #ff7f00; } | |
| 28% { color: #ffff00; } | |
| 42% { color: #00ff00; } | |
| 57% { color: #0000ff; } | |
| 71% { color: #4b0082; } | |
| 85% { color: #9400d3; } | |
| 100% { color: #ff0000; } | |
| } | |
| `; | |
| document.head.appendChild(style); |