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

MP3 Player

به نام خدا

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

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

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

– – – – – – – – – –

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

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

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

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

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

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

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

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

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

– – – – – – – – – –

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

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

<!-- Start Box Online Music -->
<audio class="powerpress-mejs-audio"
style="margin-top: 12px; float: left; width: 100%;"
src="Your Music Address" preload="none" controls="controls">
</audio>
<!-- End Box Online Music -->

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

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

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

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

style="margin-top: 12px; float: left; width: 100%;"

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

style="margin-top: 12px; float: left; width: 400pt;"

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

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

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

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

MP3 Player