1. این پروژه کاملا ریسپانسیو(واکنشگرا) میباشد.
در ویدئو بالا ریسپانسیو بودن را مشاهده کنید.
2. در بالا سه تا دکمه وجود دارد وقتی روی آن کلید کنیم یک مادل نمایش داده میشود.
3. پشت مادل یک لایه تیره رنگ(overlay) نمایش داده میشود که با (addEventListener) جاوااسکریپت فانکشنی نوشتیم که وقتی روی لایه تیره رنگ(overlay) کلیک شد پنجره مادل بسته شود.
4. در پنجره مادل یک ایکون ضبدر است که با (addEventListener) جاوااسکریپت فانکشنی نوشتیم که وقتی کلیک شد پنجره مادل بسته شود.
5. در بالا یک ایکون برای حالت تاریک و روشن با فانکشن (addEventListener) جاوااسکریپت نوشتیم.
6. سمت راست دوباره با استفاده از (addEventListener) جاوااسکریپت فانکشنی نوشتیم که وقتی روی دکمه ها کلیک شد عکس ها عوض شود.
7. اول به تمام عکس ها یک (src) شبیه به هم میدیم ولی با شماره های متفاوت که وقتی Event اتفاق افتاد عکس ها بعدی و قبلی زده شود.