برای استفاده از همه امکانات سایت باید جاوا اسکریپت مرورگر خود را فعال کنید.

آموزش تگ audio در HTML - راهنمای پخش فایل صوتی در html

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

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

در حال حاضر سه فرمت MP3 ،Wav و Ogg در تگ audio پشتیبانی می شود. و مرورگرهای کروم، فایرفاکس، اپرا، و اینترنت اکسپلورر از هر سه فرمت پشتیبانی می کنند.

مرورگر سافاری نیز از دو فرمت MP3 و Wav پشتیبانی می کند.

مرورگر MP3 Wav Ogg
کروم بله بله بله
فایرفاکس بله بله بله
اپرا بله بله بله
سافاری بله بله ---
اینترنت اکسپلورر / اج بله بله بله

 

مثال:

 

 <audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
  Your browser does not support the audio tag.
</audio>


در مثال بالا فایل های صوتی در تگ source برای تگ audio تعریف شده است و نوع فرمت فایل با استفاده از type تعیین شده است.

در صورتی که مرورگری از تگ audio پشتیبانی نکند، متن بین تگ audio برای کاربر نمایش داده می شود. مثلا: Your browser does not support the audio tag در مثال بالا.


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

تگ <audio> در مرورگرهای کروم 4، فایرفاکس 3.5، اپرا 11.5، سافاری 4، اینترنت اکسپلورر 9 به بالا پشتیبانی می شود.

مرورگر کروم فایرفاکس اپرا سافاری اینترنت اکسپلورر / اج
پشتیبانی 4 3.5 11.5 4 9


ویژگی ها

ویژگی مقدار توضیحات
autoplay autoplay برای فعال کردن پخش خودکار فایل صوتی به کار می رود.
controls controls برای نمایش دکمه های پخش (play، paus، stop و...) به کار می رود.
loop loop برای فعال کردن تکرار پخش فایل صوتی به کار می رود.
muted muted برای قطع صدای فایل صوتی به کار می رود.
preload auto
metadata
none
برای بارگذاری فایل صوتی، هنگام بارگذاری صفحه به کار می رود.
src URL برای مشخص کردن آدرس فایل صوتی به کار می رود.


MIME Types فرمت های صدا

فرمت فایل نوع رسانه
MP3 audio/mpeg
WAV audio/wav
Ogg audio/ogg


مثال شماره ۱ : استفاده از ویژگی controls برای نمایش دکمه های پخش ، تنظیم صدا و..

<audio controls>
 <source src="files/demo.mp3" type="audio/mpeg">
</audio>


مثال شماره ۲ : پخش خودکار فایل صوتی

<audio controls autoplay>
 <source src="files/demo.mp3" type="audio/mpeg">
</audio>


مثال شماره ۳ : تکرار پخش فایل صوتی

<audio controls loop>
 <source src="files/demo.mp3" type="audio/mpeg">
</audio>


مثال شماره ۴ : غیرفعال کردن بارگذاری خودکار فایل صوتی همزمان با بارگذاری صفحه

<audio controls preload="none">
 <source src="files/demo.mp3" type="audio/mpeg">
</audio>


مثال شماره ۵ : مخفی کردن پلیر در صفحه ( یعنی آهنگ خودکار خودش پلی میشه ولی خوده پلیر مخفیه )

<audio autoplay>
 <source src="files/demo.mp3" type="audio/mpeg">
</audio>


پشتیبانی از ویژگی ها و رویدادهای عمومی

تگ <audio> از ویژگی های عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.

 

موضوع: آموزش HTML
کلمات کلیدی: ، ، ، ، ، ، ، ، ، ، ،

نظرات نظرات تا اطلاع ثانوی غیر فعال است.