آموزش های حرفه ای
مای دیزاین به عنوان یکی از تولید کنندگان محتوای آموزشی در زمینه طراحی وب و گرافیک به صورت تصویری، با کیفیت و اختصاصی در خدمت شما کاربران عزیز می باشد!
نرم افزار آندروید
طراحی و ساخت نرم افزار آندروید خدمت جدیدی است که در مای دیزاین ارائه میشود. داشتن نرم افزار برای گوشی های هوشمند امری جدید و هیجان انگیز می باشد!
طراحی وب و گرافیک
یکی از خدمات ما طراحی سایت های ایستا و پویا با جدید ترین متد های روز دنیاست. ساخت قالب هایی سبک و در عین حال زیبا، با استفاده از وردپرس، تخصص ماست!
پخش فیلم با استفاده تگ video در html5

پخش فیلم با استفاده تگ video در html5
سلام. امروز یک آموزش از HTML5 براتون آماده کردم. با استفاده از این تگ میتونید به سادگی فیلم و کلیپ مورد نظر خودتون رو داخل سایتتون قرار بدید. با مای دیزاین همراه باشید.
در پست های گذشته آموزش “پخش صدا با استفاده تگ audio در html5” رو با هم دیدیم اما امروز با آموزشی بسیار شبیه به همان آموزش قصد معرفی تگ video رو دارم.
خوب طبق معمول ابتدا ساختار کلی کد رو براتون مینویسم و سپس به توضیح اون میپردازم:

<video width="300" height="100" poster="img.jpg" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
</video>

خوب در کد بالا تگ video رو نوشتیم و سپس با استفاده از width و height به ترتیب عرض و طول فایل ویدیویی رو مشخص کردیم، بعد از این کار با استفاده از مقدار poster آدرس عکسی که به عنوان کاور ویدیو میباشد رو دادیم (کاور عکسی است که قبل از شروع و پخش فیلم نمایان است)، سپس با controls قسمت کنترل برای پلیر خودمون رو فراخوانی کردیم.
خوب حالا برای اینکه فایل مورد نظر در تمام مرورگر ها پخش شود باید از دو فرمت MP4 و OGG استفاده کنیم و در src هم آدرس فایل مورد نظر رو قرار دهیم.

7 پاسخ به “پخش فیلم با استفاده تگ video در html5”

  1. حسام ثنایی فرد می‌گه:

    سلام.این کدو کجای قالب قرار بدم؟؟

  2. mohammad asg می‌گه:

    چه جوری میشه ویدیو با چند کیفیت مختلف اپلود کرد؟

  3. سینا عقیقی می‌گه:

    سلام ، خیلی ممنون از این آموزش فوق العاده شما در زمینه Html5 T واقعا عالی بود. یه سوال اگه خطی که توش نوشته MOVIE.OGG رو حذف کنیم کار میکنه دیگه؟؟؟

  4. علیرضا می‌گه:

    سایت عالی دارید

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

آخرین محصولات فروشگاه
برخی مطالب تصادفی مای دیزاین
طرح لایه باز دفترچه و تخته در ۳ رنگ
خرید قالب وردپرس مای دیزاین (نسخه ۳٫۰)
نمایش مطالب از دسته بندی خاص در وردپرس
طرح لایه باز مانیتور به سبک تخت (flat)
مجموعه عظیم آیکون های کاربردی (سری ششم)
مجموعه عظیم آیکون های کاربردی (سری اول)