Computer >> 컴퓨터 >  >> 프로그래밍 >> HTML

HTML DOM Video defaultMuted 속성 – 비디오 기본 음소거 설정하기

HTML DOM의 Video defaultMuted 속성은 비디오의 오디오가 기본적으로 음소거(mute) 상태인지 여부를 나타내는 불리언(Boolean) 값을 반환하거나 설정합니다.

참고 − 이 속성은 HTML 문서에 동적인 효과를 직접 적용하지 않으며, 단순히 HTML DOM Video muted 속성의 현재 상태를 반영하는 역할만 합니다.

문법(Syntax)

다음은 defaultMuted 속성의 사용 문법입니다.

불리언 값 반환 (true/false):

mediaObject.defaultMuted

불리언 값 설정:

mediaObject.defaultMuted = booleanValue

여기서 booleanValue에 사용할 수 있는 값은 다음과 같습니다.

booleanValue
설명
true
비디오가 기본적으로 음소거 상태로 재생됨을 의미합니다.
false
비디오가 기본적으로 음소거 상태가 아님을 의미합니다.

이제 Video defaultMuted 속성의 실제 사용 예제를 살펴보겠습니다.

예제(Example)

<!DOCTYPE html>
<html>
<head>
<title>HTML DOM Video defaultMuted</title>
<style>
   * {
      padding: 2px;
      margin:5px;
   }
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
   <form>
      <fieldset>
         <legend>HTML-DOM-Video-defaultMuted</legend>
         <video id="demo" width="320" controls><source    src="https://www.tutorialspoint.com/html5/foo.mp4" type="video/mp4"></video><br>
         <input type="button" onclick="getTrackDetails(1)" value="Day Time">
         <input type="button" onclick="getTrackDetails(2)" value="Night Time">
         <div id="divDisplay">
         </div>
      </fieldset>
   </form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var demo = document.getElementById("demo");
   function getTrackDetails(val) {
      if(val == 1){
         demo.defaultMuted = false;
         divDisplay.textContent = 'Its day time!';
      }
      else{
         demo.defaultMuted = true;
         divDisplay.textContent = 'Its night, so video will be on mute by default!';
      }
   }
</script>
</body>
</html>

실행 결과(Output)

'Night Time' 버튼을 클릭한 경우 −

HTML DOM Video defaultMuted 속성 – 비디오 기본 음소거 설정하기

'Day Time' 버튼을 클릭한 경우 −

HTML DOM Video defaultMuted 속성 – 비디오 기본 음소거 설정하기

위 예제에서 볼 수 있듯이, 'Night Time' 버튼을 클릭하면 defaultMuted 속성이 true로 설정되어 비디오가 기본적으로 음소거 상태가 되고, 'Day Time' 버튼을 클릭하면 false로 설정되어 소리가 켜진 상태로 재생됩니다. 이처럼 defaultMuted 속성을 활용하면 사용자 환경이나 상황에 따라 비디오의 초기 오디오 상태를 손쉽게 제어할 수 있습니다.