วิธีปิดเสียงวิดีโอ (Mute) ใน HTML

ใช้แอตทริบิวต์ muted เพื่อตั้งค่าให้เสียงของวิดีโอถูกปิด (Mute) ตั้งแต่เริ่มต้น

ตัวอย่าง

ลองรันโค้ดต่อไปนี้เพื่อใช้งานแอตทริบิวต์ muted:

<!DOCTYPE HTML>
<html>
  <body>
    <video width="300" height="200" controls muted>
      <source src="/html5/foo.ogg" type="video/ogg" />
      <source src="/html5/foo.mp4" type="video/mp4" />
      Your browser does not support the video element.
    </video>
  </body>
</html>

การทำงานของ muted

• วิดีโอจะเริ่มเล่นโดยไม่มีเสียง (Muted by default)
• ผู้ใช้สามารถ Unmute ได้จาก Controls ของเบราว์เซอร์
• เป็น Boolean attribute - มีอยู่ = true, ไม่มี = false

Autoplay Policy และ Muted

<!-- นี้จะทำงานได้ (Autoplay + Muted) -->
<video autoplay muted>
  <source src="video.mp4">
</video>

<!-- นี้จะถูกบล็อกในเบราว์เซอร์ส่วนใหญ่ -->
<video autoplay>
  <source src="video.mp4">
</video>

ควบคุม Muted ด้วย JavaScript

<video id="myVideo" src="video.mp4" controls muted></video>
<button onclick="toggleMute()">Toggle Mute</button>

<script>
const video = document.getElementById('myVideo');

function toggleMute() {
  video.muted = !video.muted;
  console.log('Muted:', video.muted);
}

// หรือใช้ volume = 0 (แตกต่างจาก muted)
video.volume = 0; // ไม่มีเสียง แต่ไม่ใช่ muted state

แอตทริบิวต์เสียงอื่นๆ ของ <video> และ <audio>