NTM Solutions

Thứ Bảy, 11 tháng 6, 2022

Tự học HTML - Bài 30 - Xử lý AUDIO

Thẻ <audio>

Để phát 01 tập tin audio trong HTML, ta dùng thẻ <audio>

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

 

Cách hoạt động

Thuộc tính controls thêm vào các nút điều khiển như play, pause, và volume.

Thẻ <source> cho phép ta khai báo đường dẫn và định dạng. Trình duyệt sẽ nhận định dạng tập tin audio trước tiên.

Dòng chữ giữa cặp thẻ <audio></audio> sẽ chỉ được hiển thị trên trình duyệt nếu không hỗ trợ thẻ <audio>

Thuộc tính autoplay

Để thiết lập phát tự động tập tin audio, ta dùng thuộc tính autoplay.

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

 

Ghi chú: 01 số trình duyệt như Firefox hay Chrome có thể không hỗ trợ tính năng này(ngoại trừ bật chế độ muted).

 

Nếu thêm thuộc tính muted sau autoplay, trình duyệt sẽ tự động phát tập tin audio (nhưng không có tiếng).

Ví dụ:

<audio controls autoplay muted>
  <source src="nhac.ogg" type="audio/ogg">
  <source src="nhac.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

 

Các định dạng audio và khai báo media

Định dạng

Kiểu Media

MP3

audio/mpeg

OGG

audio/ogg

WAV

audio/wav

 

Phương thức, thuộc tính và sự kiện

Các phương thức, thuộc tính và sự kiện trong thẻ <audio> được tổ chức theo cấu trúc HTML DOM.

Điều này cho phép ta tải, phát và dừng nhạc, cũng như thiết lập khoảng thời gian và âm lượng.

Cũng có các sự kiện DOM có thể cảnh báo bạn khi bắt đầu phát hay dừng nhạc.

 

Các thẻ audio

Thẻ

Mô tả

<audio>

Khai báo nội dung âm thanh

<source>

Khai báo nhiều nguồn âm thanh, như <video> và <audio>

Nếu vẫn chưa rõ, các bạn xem thêm video clip sau:

 

Xem MỤC LỤC BÀI VIẾT VỀ HTML

Sưu tầm bởi #drM

Không có nhận xét nào:

Đăng nhận xét

Facebook Youtube RSS