CSS و جاوا اسکریپت: سواحل – انجمن DEV

این یک ارسال برای Frontend Challenge نسخه 24.04.17، Glam Up My Markup: Beaches است.

چیزی که من ساختم

1. CSS: من از طرحی مدرن و تمیز با پالت رنگی استفاده کرده‌ام که تم ساحل، تغییرات صاف و افکت‌های شناور را منعکس می‌کند.
2. جاوا اسکریپت: من عناصر تعاملی مانند یک پنجره مودال را برای نشان دادن جزئیات بیشتر در مورد هر ساحل و یک جلوه اسکرول صاف برای تجربه کاربری بهتر اضافه کردم.

نسخه ی نمایشی

پیوند GitHub: سواحل

سفر

پیشرفت های کلیدی:

1. Modal Animation: انیمیشن‌های fade-in و slide-in برای مودال اضافه شده تا جذاب‌تر شود.
2. فیلتر پس‌زمینه: برای فوکوس بهتر و ظاهری مدرن، وقتی مدال باز است، یک جلوه تاری روی پس‌زمینه اعمال می‌کند.
3. جلوه‌های شناور: افکت‌های شناور را به آیتم‌های فهرست ساحل اضافه کرد تا آنها را تعاملی و از نظر بصری جذاب کند.
4. طراحی واکنش گرا: مطمئن می شود که مودال پاسخگو است و در اندازه های مختلف صفحه نمایش خوب به نظر می رسد.
5. تعامل: هر عنوان ساحل را قابل کلیک برای فعال کردن مدال، نمایش اطلاعات بیشتر به صورت پویا کرد.