أفضل الأكواد والمشاريع HTML و CSS و JS الجاهزة على Codepen (الجزء الثالث)
تطوير ويب لغات برمجة
إستمرار لما كنت قد أطلقته سابقا على مدمن ويب، وهي سلسلة أفضل الأكواد والقوالب والمشاريع الجاهزة (HTML و CSS و Javascript) على موقع CodePen والتي بدأتها بالجزء الأول و الثاني في المقالين السابقين.
- أفضل أكواد وقوالب HTML و CSS و JS ومشاريع جاهزة على Codepen (الجزء الأول)
- أفضل أكواد وقوالب HTML و CSS و JS ومشاريع جاهزة على Codepen (الجزء الثاني).
- أفضل الأكواد HTML و CSS و JS الجاهزة على موقع Codepen (الجزء الرابع).
- أفضل أكواد HTML و CSS و JS جاهزة على Codepen (الجزء الخامس).
- أفضل أكواد HTML و CSS و JS جاهزة على Codepen (الجزء السادس).
- أفضل أكواد وقوالب HTML و CSS و JS ومشاريع جاهزة على Codepen (الجزء السابع)
أعود إليكم بالجزء الثالث من السلسلة لأفضل أكواد ومشاريع HTML و CSS و JS جاهزة على Codepen للإستفادة منها في مشاريعكم وأعمالكم أو للإلهام والحصول على أفكار جديدة ومبتكرة لتصميم الواجهات الأمامية أو لعناصر في مواقعكم ومشاريعكم في مجال تطوير الويب والواجهات الأمامية.
هذه الأكواد والمشاريع المميزة ستساعدكم بشكل كبير ومذهل في تطوير أعمالكم ومشاريعكم على الويب وتصميم الواجهات الأمامية وكل من يعمل في مجال تطوير الويب والبرمجة.
{tocify} {$title=ستقرأ في هذا المقال}أفضل أكواد ومشاريع HTML و CSS و JS جاهزة على Codepen (الجزء الثالث)
Dark mode toggle expanding circle
مشروع مميز لتفعييل خاصية التبيدل للوضع المظلم بأسلوب إنسيابي مميز وفريد.
See the Pen Dark mode toggle expanding circle by Zed Dash (@z-) on CodePen.
Hero Banner with Floating Navigation
لافتر الهيرو Hero Banner مع خاصية التنقل العائم.
See the Pen Hero Banner with Floating Navigation by Yudiz Solutions Pvt. Ltd. (@yudizsolutions) on CodePen.
Tic-Tac-No-JS (CSS only tic-tac-toe)
مشروع تصميم لعبة أو إكس بأسلوب جميل ومميز بلغة CSS فقط.
See the Pen Tic-Tac-No-JS (CSS only tic-tac-toe) by Zed Dash (@z-) on CodePen.
CSS Goey footer
خلفية متحركة بأسلوب فريد للفوتر.
HTML + CSS
See the Pen CSS Goey footer by Zed Dash (@z-) on CodePen.
CSS only click counter ± using checkboxes
نموذج لحساب عدد النقرات من خلال صناديق التحقق
HTML + CSS + Javascript
See the Pen CSS only click counter ± using checkboxes by Zed Dash (@z-) on CodePen.
:has() Sibling Gallery
كود مميز لعرض الصور بأسلوب مميز وفريد
HTML + CSS + Javascript
See the Pen :has() Sibling Gallery by Jhey (@jh3y) on CodePen.
Footer sorrow
HTML + CSS + jQuery + Javascript
See the Pen Footer sorrow by Steve Gardner (@ste-vg) on CodePen.
Sidebar Interaction
عمود جانبي تفاعلي مع خاصية العرض المظلم بأسلوب مميز.
HTML + CSS + jQuery + Javascript
See the Pen Sidebar Interaction by Aybüke Ceylan (@aybukeceylan) on CodePen.
إقرأ أيضا: مواقع رائعة لممارسة البرمجة وتطوير مشاريع الويب .
Expandable Animated Card Slider
سلايدر متحرك بشكل رائع وفريد
HTML + CSS + jQuery + Javascript
See the Pen Expandable Animated Card Slider by Yudiz Solutions Pvt. Ltd. (@yudizsolutions) on CodePen.
Fluid text hover/h3>
تأثير التمرير المرن على النص مع خلفية صورية
HTML + CSS + JS
See the Pen Fluid text hover by Robin Delaporte (@robin-dela) on CodePen.
Grid and Container Queries!
عرض الحاويات بأسلوب الشبكة.
HTML + CSS
See the Pen Grid and Container Queries! by Ryan Trimble (@mrtrimble) on CodePen.
Voyage Slider | GSAP
سلايدر Voyage Slider | GSAP مميز.
HTML + CSS + jQuery + Javascript
See the Pen Voyage Slider | GSAP by Sikriti Dakua (@dev_loop) on CodePen.
Ngarly Grid
عرض العناصر بأسلوب الشبكة - Ngarly Grid بستايل مميز وفريد.
See the Pen Codepen Challenge: Ngarly Grid by Sicontis (@Sicontis) on CodePen.
Sliding Words [Tap to restart]
تأثير نصي متحرك مميز وفريد تأثير التقطيع.
See the Pen Sliding Words [Tap to restart] by Jhey (@jh3y) on CodePen.
إقرأ أيضا: 9 مواقع وأدوات مفيدة لتطوير و تصميم الواجهات الأمامية ومواقع الويب .
Skateboard Video Platform
مشروع واجهة أمامية لمنصة فيديو بألوان مميزة وفريدة.
See the Pen Skateboard Video Platform by Aysenur Turk (@TurkAysenur) on CodePen.
Animated Star Rating
كود مميز لعرض التقييم بأسلوب مميز متحرك.
See the Pen Animated Star Rating by Jon Kantner (@jkantner) on CodePen.
Black / White Button
تأثيرات متنوعة للتمرير على الأزرار باللون الأسود والأبيض.
See the Pen Black&White Button by Yuhomyan (@yuhomyan) on CodePen.
الخلاصة
كان هذا هو الجزء الثالث من سلسلة أفضل أكواد ومشاريع HTML و CSS و JS الجاهزة على Codepen والتي يقدمها مدمن ويب، والذي ستتبعه أجزاء أخرى ستتضمن أكواد Pens ومشاريع جاهزة رائعة ومميزة للإستفادة منها في تطوير أعمالكم ومشاريعكم ومواقعكم الألكترونية بشكل أفضل.
إذا كان لديك أي تعليق أو روابط لأكواد ومشاريع أخرى على موقع Codepen تقترحها علينا، فشاركها معنا في التعليقات أدناه لنقوم بإضافتها وإدراجها في الأجزاء القادمة.
