A modern single-page application built with vanilla JavaScript, demonstrating advanced DOM manipulation, smooth scrolling, tabbed components, lazy loading, modals, sliders, sticky navigation, and intersection observers.
This project is part of my JavaScript learning journey, inspired by Jonas Schmedtmann’s JavaScript course.
- 🔒 Modal Window → Open/close with buttons or
Escapekey - 🎯 Smooth Scrolling → Jump to sections with smooth animations
- 🗂 Tabbed Component → Switch between operations tabs dynamically
- 🌐 Navigation Scroll → Page navigation with event delegation
- 🎨 Navigation Hover Animation → Fades sibling links on hover
- 📌 Sticky Navigation → Navbar sticks to the top on scroll
- 👀 Section Reveal on Scroll → Sections fade in when visible
- 🖼 Lazy Loading Images → High-resolution images load on demand
- 🎞 Image Slider → Slide between images with arrows, dots, or keyboard
- HTML5
- CSS3 (Flexbox, Grid, animations)
- Vanilla JavaScript (ES6+)
🎯 Learning Objectives
-
This project helped me practice:
-
DOM selection and manipulation
-
Event handling (bubbling, delegation, keyboard events)
-
Intersection Observer API
-
Creating sliders, tabs, sticky navbars without libraries
-
Writing clean, modular JavaScript code
📌 Future Improvements
-
Add user authentication (Login system)
-
Connect to a backend for real banking operations
-
Improve mobile responsiveness
👨💻 Author
Developed by AtaDevPro ✨ Inspired by Jonas Schmedtmann’s JavaScript course.