Bringing Web Pages to Life — CSS & JavaScript

A compact, polished demo that blends CSS3 transitions/keyframes with modular JavaScript. It showcases:

• Hover/active micro-interactions (transitions)
• Keyframed motion (float, spinner, modal entrance)
• Reusable JS functions with parameters, return values, and scope (global/local/closure)
• JS-driven class toggles to trigger CSS animations (flip card, modal, loader)
• A working theme toggle (light/dark) persisted with localStorage

Files

• index.html — semantic structure & controls
• styles.css — theme variables, transitions, keyframes
• script.js — functions for duration math, class toggling, and DOM actions

How to run

Open index.html in any modern browser. No build step needed.

Author

Augusto Mate · [email protected]

---

Assignment fit: Part 1 (visual effects), Part 2 (functions & scope), Part 3 (integration via class toggling).

Version: v2.0.0 Update

• Added accessibility improvement: modal can now be closed with the Escape key, in addition to click.