كيفية إنشاء شريط تمرير تلقائي للصور بتنسيق HTML CSS وجافا سكريبت

ستتعلم اليوم في هذه المدونة كيفية إنشاء شريط تمرير تلقائي للصور بتنسيق HTML CSS وجافا سكريبت

مرحبًا أيها الأصدقاء ، ستتعلم اليوم في هذه المدونة كيفية إنشاء شريط تمرير تلقائي للصور بتنسيق HTML CSS وجافا سكريبت.

أنا متأكد من أنك رأيت شريط الصور التلقائي أو تأثير العرض الجانبي على العديد من مواقع الويب. عرض الشرائح هو عرض تقديمي لسلسلة من الصور الثابتة على شاشة عرض أو جهاز عرض إلكتروني ، عادةً في تسلسل مُرتب مسبقًا. قد تكون تغييرات الصور تلقائية وعلى فترات منتظمة أو قد يتم التحكم فيها يدويًا بواسطة مقدم العرض أو العارض.

سأشارك اليوم في هذه المدونة شريط تمرير الصور التلقائي. يوجد في شريط التمرير هذا خمس صور ، وتتغير هذه الصور تلقائيًا بعد فترة معينة. لقد استخدمت JavaScript لتغيير الصورة بعد فترة زمنية معينة. إذا كنت لا تعرف JavaScript ، فيمكنك مشاهدة هذا الفيديو حيث أنشأت Automatic Image Slider في HTML و CSS.

لقد رأيت في الفيديو كيف يبدو شريط تمرير الصور التلقائي هذا وآمل أن تكون قد فهمت الرموز الأساسية وراء إنشاء شريط تمرير الصورة هذا. كما تعلم ، لقد استخدمت JavaScript لإكمال تأثير عرض الشرائح هذا. باستخدام الخاصية CSSkeyframes ، يمكنك أيضًا إنشاء هذا النوع من تأثير عرض شرائح الصور.

إذا كنت تحب شريط التمرير التلقائي للصور وتريد الحصول على أكواد المصدر. يمكنك بسهولة نسخ الرموز من مربعات كود النسخ المحددة وكذلك يمكنك تنزيل ملفات التعليمات البرمجية المصدر. يمكنك استخدام شريط تمرير الصور هذا على مواقع الويب والمشاريع الخاصة بك.

شريط التمرير التلقائي للصور في HTML CSS
لإنشاء هذا البرنامج التلقائي (Image Slideshow Effect). أولاً ، تحتاج إلى تحميل ملف الاكواد من زر التحميل

الملفات

ما هو رد فعلك؟

like

dislike

love

funny

angry

sad

wow