سبد (0)

پخش صدا در HTML5

HTML5 برای پخش صدا،  استانداردی را به وجود آورده است.


پخش صدا در وب

تا به حال، هرگز استانداردی برای پخش فایل های صوتی در صفحات وب وجود نداشته است.

امروزه، فایل های صوتی عموماً از طریق یک پلاگین مثل Flash نشان داده می شوند. هر چند همه مرورگرها، پلاگین های مشابهی ندارند.

HTML5 روش استانداردی را برای پخش فایل های صوتی با استفاده از عنصر <audio> فراهم کرده است.


پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

مرورگرهای Internet Explorer 9+, Firefox, Opera, Chrome, Safari عنصر <audio> را پشتیبانی می کنند.

توجه: Internet Explorer 8 و نسخه های قدیمی تر آن، عنصر <audio> را پشتیبانی نمی کنند.


عنصر <audio> چگونه کار می کند؟

برای پخش یک فایل صوتی در HTML5 تمام آن چیزی که نیاز دارید این چند خط کد زیر است:

مثال (پخص صدا در HTML5)

<audio controls>
  <source src="/horse.ogg" type="audio/ogg">
  <source src="/horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
خودتان امتحان کنید »

ویژگی controls برای افزودن کنترل های play ،pause و صدا می باشد.

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

Your browser does not support the audio tag.

تگ <audio> به شما اجازه می دهد که چند تگ <source> داشته باشید. تگ های <source> می تواند به فایل های صوتی مختلفی لینک شوند. مرورگر اولین فرمتی که قابلیت پخش آن را داشته باشد، برای کاربر پخش می کند.

مثال بالا از یک فایل Ogg استفاده کرده است و در مرورگرهای Firefox, Opera, Chrome کار می کند. برای اینکه فایل صوتی در IE و Safari و نسخه های قبلی Chrome نیز پخش شود، باید از فابل های MP3 استفاده کنید. 

تمام خصوصیت های تگ <audio>

Autoplay: در صورت وجود فایل صوتی به محض آماده شدن پخش می شود. مقداری که می گیرد: autoplay

Controls: دکمه های مختلف مثل play و ... را اضافه می کند. مقداری که می گیرد: controls

Loop: در صورت اتمام فایل صوتی دوباره از اول شروع به پخش می کند. مقداری که می گیرد: loop

Preload: کاری می کند که صدا در هنگام لود شدن صفحه، آماده پخش شود. مقداری که می گیرد: perload

Src: آدرس فایلی است که باید پخش شود. مقداری که می گیرد: یک url 


فرمت های صدا و پشتیبانی مرورگرها

در حال حاضر 3 فرمت تحت پشتیبانی عنصر <audio> قرار دارد.

  • MP3
  • Wav
  • Ogg
 
Browser MP3 Wav Ogg
Internet Explorer 9+ YES NO NO
Chrome 6+ YES YES YES
Firefox 3.6+ NO YES YES
Safari 5+ YES YES NO
Opera 10+ NO YES YES

MIME Types for Audio Formats

Format MIME-type
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه