گروه مقاله : HTML 5
تاريخ انتشار : 1394/02/30 - 09:23
كد :491

پخش صدا در وب

ممکن است در صفحات وب نیاز داشته باشید تا به پخش و اجرای فایل های صوتی و آهنگ بپردازید . HTML5 برای پخش فایل های صوتی، استانداردی را به وجود آورده است.
تا قبل از ارائه HTML 5 ، استاندارد خاصی برای پخش فایل های صوتی در صفحات وب وجود نداشت و طراحان وب برای پخش اینگونه فایل ها از پلاگین هایی مثل falsh player استفاده می کردند .HTML5 روش استانداردی را برای پخش فایل های صوتی با استفاده از عنصر <audio> فراهم کرده است.
 
پشتیبانی مرورگرها
مرورگرهای Internet Explorer 9+, Firefox, Opera, Chrome, Safari عنصر <audio> را پشتیبانی می کنند.
نکته: Internet Explorer 8 و نسخه های قدیمی تر آن، عنصر <audio> را پشتیبانی نمی کنند.
 
برای پخش یک فایل صوتی در HTML5 از تگ <audio> به صورت کد زیر استفاده کنید :
<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> (. Your browser does not support the audio tag) فقط در مرورگرهایی که از عنصر <video> پشتیبانی نمی کنند نمایش داده می شود. 
تگ <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
 
مرورگر MP3 Wav Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES YES NO
Opera YES YES YES
 
 
File Format Media Type
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav
نظرات كاربران :
نام :
ايميل :
متن نظر : * 
 
متن بالا را وارد نماييد*