آموزش طراحی سایت (HTML CSS Javascript) | آتریا

تگ video در HTML

مثال (تگ video در HTML)

استفاده از video:

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

خودتان امتحان کنید »

تعریف و کاربرد تگ video در HTML

تگ <video> مشخص کننده ویدئو مانند کلیپ فیلم و یا دیگر جریان های ویدئویی است.

در حال حاضر،برای عنصر <video> مرورگرها از سه فرمت ویدئویی MP4 ،WebM و Ogg پشتیبانی می کنند.

Browser	MP4	WebM	Ogg
Internet Explorer	YES	NO	NO
Chrome	YES	YES	YES
Firefox	YES Update 1: Firefox 21 on Windows and Android now supports MP4 Update 2: Firefox 30 on Linux now supports MP4	YES	YES
Safari	YES	NO	NO
Opera	NO	YES	YES

MP4: فایل های MPEG 4 با کدک تصویری H264 و کدک صوتی AAC
WebM: فایل های WebM با کدک تصویری VP8 و کدک صوتی Vorbis
Ogg: فایل های Ogg با کدک تصویری Theora و کدک صوتی Vorbis

انواع MIME برای فرمت های ویدئویی

Format	MIME-type
MP4	video/mp4
WebM	video/webm
Ogg	video/ogg

پشتیبانی مرورگرها از تگ video در HTML

اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.

عنصر
<video>	4.0	9.0	3.5	4.0	10.5

تفاوت بین HTML 4.01 و HTML5

تگ <video> یک تگ جدید در HTML5 است.

نکته ها و ترفندها

نکته: در صورتی که مرورگر از عنصر <video> پشتیبانی نمی کند باید بین دو تگ <video> و <video/> متنی مناسب قرار داد.

خصوصیت های اختیاری

جدید در HTML5.

خصوصیت	مقدار	توضیحات
autoplay	autoplay	در صورتی که وجود داشته باشد ویدئو به محض اینکه آماده شود خود به خود پخش می شود.
controls	controls	برای افزودن کنترل های play ،pause و صدا بکار برده می شود.
height	pixels	ارتفاع پخش کننده ویدئو را تنظیم می کند.
loop	loop	در صورت وجود پس از اتمام نمایش ویدئو پخش آن دوباره شروع می شود.
muted	muted	مشخص کننده قطع صدا به طور پیش فرض برای ویدئو است.
poster	URL	مشخص کننده تصویری است که به عنوان پیش نمایش ویدئو از آن استفاده می کند. مقدار آن یک url یا آدرس اینترنتی است.
preload	auto metadata none	در صورت وجود ویدئو در زمان لود صفحه، لود شده و آماده اجرا می شود. اگر autoplay وجود داشته باشد این خاصیت نادیده گرفته می شود.
src	URL	آدرس ویدئویی که باید پخش شود.
width	pixels	پهنای پخش کننده ویدئو را تنظیم می کند.