ورود با اکانت گوگل
یا
آقای متریال

برای جستجو کلمه مورد نظر خود را وارد کنید

آموزش استفاده از Movie Player متریال دیزاین در وب!

emmet


اطلاعات نویسنده
emmet

emmet

  • Exclusive Author
  • Iran (Islamic Republic of)
نمونه کارها
پشتیبانی
برای دیدن اطلاعات تماس تهیه کننده این محصول باید محصول رو خریداری کرده باشید

Movie Player

به نام خدا

امروز قصد معرفی و آموزش متد Video در HTML5 را داریم.این متد به تازگی همراه با HTML5 منتشر شده و یکی از متد های HTML5 است.

این متد در مرورگر های مختلف نما های مختلفی دارد.اما در مرورگر Google Chrome بصورت متریال دیزاین نمایش داده می شود.

این متد برای پخش آنلاین فایل های ویدئویی ساخته شده است و سازگاری خوبی با اندروید دارد.

– – – – – – – – – –

در زیر با تعدادی از انواع نما ها آشنا می شوید:

• متد Video در مرورگر Microsoft Edge:

Movie Player

• متد Video در مرورگر Mozilla Firefox:

Movie Player

• متد Video در مرورگر پیش فرض اندروید:

Movie Player

• متد Video در مرورگر Google Chrome:

Movie Player

– – – – – – – – – –

آموش استفاده و تغییر اندازه:

ابتدا کد زیر رو در جایی که می خواید Video Player اجرا بشه کپی کنید.

<!-- Start Box Online Video -->
<video class="g-item current" style="width: 100%;" controls="controls">
<source type="video/mp4" src="Your Video Address"> 
</video> 
<!-- End Box Online Video -->

کد های سبزرنگ برای نشانه گذاری هستند و می توانید آن هارا کپی نکنید.

اگر این کد رو در محل مناسبی کپی کرده باشید و به جای Your Video Address آدرس فایل ویدئویی خودتون رو وارد کرده باشید،نمونه مثل زیر خواهد بود:


کد بالا ، Video Player را تا جایی که امکان دارد (ساختار قالب اجازه می دهد) به گوشه های مطلب اضافه می کند.(متغیر با عرضِ نوشته است)ولی رسپانسیو است.(واکنش گرا)

برای اینکه این Video Player به اندازه ی دلخواه شما باشد،می توانید کد زیر را در سورس Audio Player پیدا کنید و مقدار کد قرمز شده ی زیر با واحد pt را تغییر دهید.البته در این صورت واکنش گرایی خود را از دست می دهد.(هر ۳ Point یا pt برابر ۱ میلی متر است)

style="width: 100%;"

بعد از تغییر، کد مانند نمونه ی زیر خواهد شد:

style="width: 400pt;"

و همینطور نمونه نمایشی مانند نمونه زیر:

 کار تمام است و شما می توانید از Video Player متریال دیزاین خود لذت ببرید.

برای راحتی کاربران نیز کد کامل پست برای دانلود گذاشته شده است.

اگر هرگونه اشکال در نصب،اجرا و… در مورد این پست داشتید در بخش نظرات اعلام کنید!

Movie Player

دیدگاه هایی که برای این مطلب ارسال شده

  1. ﻧﻮﯾﺴﻨﺪﻩ ﺩﯾﺪﮔﺎﻩ: محسن شهریور ۱۹, ۱۳۹۵

    آموزش ها متریال در وب رو هم بیشتر کنید عالیه ممنون. مثلا طراحی قالب های متریال

    • ﻧﻮﯾﺴﻨﺪﻩ ﺩﯾﺪﮔﺎﻩ: Emmet Sanders شهریور ۲۱, ۱۳۹۵

      نظر لطفتونه.
      در حال کار روی قالب متریال دیزاین پلوتو برای فارسی سازی هستیم.
      بزودی آموزش طراحی قالب متریال هم قرار می دیم.

شما هم دیدگاهی برای این مطلب ارسال کنید

مطالب مرتبط

مطالب تصادفی

لوگوی دوستان

هایپر تمپ | HyperTemp