التعليق: يتم عرض معظم مقاطع الفيديو من خلال المكونات الإضافية (مثل Flash). ومع ذلك ، ليس كل المتصفحات لديها نفس المكون الإضافي ، يحدد HTML5 طريقة قياسية لتضمين مقاطع الفيديو من خلال عناصر الفيديو ، والتي يمكن استخدامها لإكمال تشغيل الفيديو
اليوم ، يتم عرض معظم مقاطع الفيديو من خلال الإضافات (مثل Flash). ومع ذلك ، ليس كل المتصفحات لديها نفس المكون الإضافي.يحدد HTML5 طريقة قياسية لتضمين مقاطع الفيديو من خلال عناصر الفيديو.
في HTML5 ، يدعم عنصر الفيديو حاليًا ثلاثة تنسيقات من ملفات الفيديو.
1.Ogg = ملف OGG مع ترميز الفيديو الخاص بـ Theora وترميز صوت Vorbis
2.MPEG4 = ملف mpeg 4 مع ترميز الفيديو H.264 وترميز الصوت AAC
3.webm = ملف webm مع ترميز الفيديو VP8 وترميز صوت Vorbis
إذن كيف تعرض مقاطع الفيديو في HTML5؟ الأمثلة على النحو التالي:
<video src = "demo.mp4" Controls = "Controls"> لا يدعم متصفحك تنسيق الفيديو هذا. </video>
حسنًا ، دعنا نوضح معنى كل سمة في عنصر الفيديو. من بينها ، لن يتم شرح العرض والارتفاع. نتحدث بشكل رئيسي عن الضوابط. كما يوحي الاسم ، فإن عناصر التحكم هي عناصر تحكم ، هاها ، فهي عناصر تحكم مثل تشغيل الفيديو ، وقفة مستوى الصوت ، إلخ.
تجدر الإشارة إلى أنه للتأكد من أنه مناسب لمتصفح Safari ، يجب أن يكون ملف الفيديو من نوع MP4. مقاطع فيديو تنسيق OGG مناسبة لمتصفحات Firefox و Opera و Chrome. لا يدعم Internet Explorer 8 عناصر الفيديو. في IE 9 ، يتم توفير دعم لعناصر الفيديو باستخدام MPEG4.
بالطبع ، إذا لم نكن متأكدين من شكل مقاطع الفيديو التي يدعمها متصفحنا ، فيمكننا أولاً التحقق من ذلك. طريقة الكشف متوفرة في منشور مدونة آخر. إذا كنت مهتمًا ، فيمكنك التحقق من ذلك. إذا كنت لا تريد أن تكون مزعجًا ، فماذا يجب أن تفعل؟ يمكننا أن نفعل هذا:
<controls video = "Controls">
<source src = "movie.ogg" type = "video/ogg">
<source src = "movie.mp4" type = "video/mp4">
لا يدعم متصفحك تنسيق الفيديو هذا.
</video>
يسمح عنصر الفيديو عناصر مصدر متعددة. يمكن لعنصر المصدر ربط ملفات الفيديو المختلفة. سيستخدم المستعرض أول تنسيق يمكن التعرف عليه ، لذلك نحتاج فقط إلى إعداد عدد قليل من مقاطع الفيديو بتنسيقات مختلفة.
بعد ذلك ، سنقدم خصائص العديد من علامات الفيديو.
1.Autoplay: تظهر هذه الخاصية تعني أن الفيديو سيعزف تلقائيًا عندما يكون جاهزًا. الاستخدام: autoplay = autoplay
2.Controls: تظهر هذه الخاصية يعني أن المستخدم يتم عرضه بعناصر تحكم ، مثل أزرار التشغيل ، إلخ. الاستخدام: عناصر التحكم = عناصر التحكم
3. الراحة: ضبط الارتفاع
4.WIDTH: عرض العرض
5.loop: إعادة التشغيل التلقائي ، الاستخدام: حلقة = حلقة
6. preload: يتم تحميل الفيديو وجاهز لتشغيله عند تحميل الصفحة. الاستخدام: مسبق = Auto
تلقائي - قم بتحميل الفيديو بالكامل بعد تحميل الصفحة
META - يتم تحميل البيانات الوصفية فقط بعد تحميل الصفحة
لا شيء - لم يتم تحميل الفيديو بعد تحميل الصفحة
ملاحظة: إذا تم استخدام التشغيل التلقائي ، يتم تجاهل التحميل المسبق.
7.SRC: عنوان URL لتشغيل الفيديو