แท็ก audio
แท็ก audio ควบคุมการเล่น
ไฟล์เสียงบนหน้า HTML เมื่อ
เพิ่มแท็กนี้ จะมีเครื่องเล่นปรากฏขึ้นบนหน้า
ซึ่งจะมีปุ่ม "ย้อนกลับ", "ไปข้างหน้า",
"หยุด" และอื่น ๆ (รูปร่างและจำนวนปุ่มขึ้นอยู่
กับเบราว์เซอร์) ระบุพาธไปยังไฟล์ผ่าน
แอตทริบิวต์ src หรือแท็กที่ซ้อนอยู่ source
แท็ก source มีไว้เพื่อระบุ
พาธไปยังไฟล์เสียงในรูปแบบต่าง ๆ
(เนื่องจากเบราว์เซอร์รองรับรูปแบบไฟล์เสียง
ที่แตกต่างกัน เช่น mp3 หรือ wav)
หากคุณมีไฟล์เสียงในรูปแบบหนึ่ง
จำเป็นต้องแปลงเป็นรูปแบบอื่น ๆ ด้วย
ภายในแท็ก audio สามารถเขียนข้อความได้
ซึ่งจะแสดงในเบราว์เซอร์ที่
ไม่รองรับ audio ใน HTML (ทำเพื่อ
แจ้งผู้ใช้เกี่ยวกับเรื่องนี้)
หากคุณต้องการเห็นเครื่องเล่นสำหรับควบคุมการเล่น
ไฟล์เสียง - ควรเพิ่มแอตทริบิวต์ controls
หากไม่มีแอตทริบิวต์นี้ คุณจะไม่เห็นอะไรเลย - และจะไม่มี
เสียงด้วย หากต้องการให้มีเสียงในขณะที่ไม่มี
เครื่องเล่น - ให้เพิ่มแอตทริบิวต์ autoplay
แอตทริบิวต์
| แอตทริบิวต์ | คำอธิบาย |
|---|---|
src |
ระบุพาธไปยังไฟล์เสียง
แต่ควรใช้แท็ก source สำหรับจุดประสงค์นี้
(ในกรณีนี้จะสามารถระบุไฟล์เสียงในรูปแบบต่าง ๆ ได้)
|
preload |
ใช้สำหรับโหลดไฟล์เสียงพร้อมกับการโหลดหน้าเว็บไซต์
ค่าที่รับได้: none (ไม่โหลดไฟล์, ค่าเริ่มต้น),
metadata (โหลดเฉพาะข้อมูลเมตา: ระยะเวลาการเล่นเสียง เป็นต้น),
auto (โหลดไฟล์เสียงทั้งหมดเมื่อหน้า HTML โหลด)
|
autoplay |
เสียงจะเริ่มเล่นทันทีหลังจากหน้าเว็บโหลดเสร็จ
การมีแอตทริบิวต์ preload จะถูกมองข้าม
แอตทริบิวต์ที่ไม่มีค่า |
controls |
เพิ่มแผงควบคุมให้กับไฟล์เสียง
การมีแอตทริบิวต์ preload จะถูกมองข้าม
แอตทริบิวต์ที่ไม่มีค่า |
loop |
เล่นไฟล์เสียงซ้ำเป็น "วงกลม": หลังจากจบแล้วจะเริ่มเล่นใหม่
การมีแอตทริบิวต์ preload จะถูกมองข้าม
แอตทริบิวต์ที่ไม่มีค่า ค่าเริ่มต้น (หากไม่มีแอตทริบิวต์) จะเล่นไฟล์เพียง 1 ครั้ง
|
muted |
ปิดเสียงในไฟล์เสียง
แอตทริบิวต์ที่ไม่มีค่า ค่าเริ่มต้น (หากไม่มีแอตทริบิวต์) ไฟล์เสียงจะมีเสียงเปิดอยู่ |
ตัวอย่าง . เครื่องเล่นบนหน้าเว็บไซต์
มาเพิ่มเครื่องเล่นพร้อมไฟล์เสียงลงในหน้ากัน
สำหรับเบราว์เซอร์ที่ไม่รองรับ
แท็ก audio ได้ทิ้งข้อความไว้
เกี่ยวกับเรื่องนี้:
<audio src="track.mp3" controls>
เบราว์เซอร์ของคุณไม่รองรับ audio บน HTML5
</audio>
ตัวอย่าง . เครื่องเล่นบนหน้าเว็บไซต์พร้อมแท็ก source
คราวนี้ แทนที่จะใช้แอตทริบิวต์ src
สำหรับแท็ก audio มาลองเพิ่มแท็ก source แทน:
<audio controls>
<source src="track.mp3">
เบราว์เซอร์ของคุณไม่รองรับ audio บน HTML5
</audio>
