تفاصيل العمل

معرض صور ويب تفاعلي

هذا المشروع هو معرض صور حديث وتفاعلي، يعمل بالكامل في متصفح المستخدم دون الحاجة إلى خادم (Server). تم بناء المشروع باستخدام JavaScript الخام (Vanilla JS) وتقنيات الويب الأساسية، مما يجعله سريعًا وفعالًا. يوفر المشروع تجربة استخدام سلسة لإضافة وعرض وإدارة الصور بسهولة.

المميزات الرئيسية

تصميم متجاوب: المعرض مصمم ليعمل بكفاءة على جميع أحجام الشاشات، من الهواتف الذكية إلى الحواسب المكتبية، بفضل استخدام تقنية CSS Grid.

عارض صور احترافي (Lightbox): عند الضغط على أي صورة، تظهر في نافذة عرض احترافية بملء الشاشة مع إمكانية التكبير والتصغير، وذلك باستخدام مكتبة PhotoSwipe.js.

نظام رفع مرن للصور:

يدعم رفع صورة واحدة، مع ظهور نافذة منبثقة لإدخال اسم مخصص لها.

يدعم رفع مجموعة صور دفعة واحدة، مع استخدام أسماء الملفات الأصلية تلقائيًا لتوفير الوقت.

إدارة كاملة للصور: تحكم كامل في الصور يشمل الإضافة (رفع)، العرض، التعديل (تغيير الأسماء)، والحذف (سواء بشكل فردي أو جماعي).

وضع التحديد المتعدد: يمكنك الدخول في "وضع التحديد" لاختيار عدة صور وحذفها دفعة واحدة، مما يسهل عملية إدارة المعرض.

التقنيات المستخدمة

HTML5: لهيكلة المحتوى.

CSS3: للتصميم والأنماط البصرية والتجاوب.

JavaScript (ES6+): لتنفيذ كل الوظائف التفاعلية وإدارة المعرض.

FileReader API: لقراءة ملفات الصور التي يختارها المستخدم من جهازه.

PhotoSwipe.js: لتقديم تجربة عرض الصور الاحترافية.

ملفات مرفقة

بطاقة العمل

اسم المستقل
عدد الإعجابات
0
عدد المشاهدات
1
تاريخ الإضافة
تاريخ الإنجاز
المهارات