에 볼륨을 음소거 해제 내 HTML5 비디오

Question

나는이 내 비디오에 매여 다음과 같은 마크 업 :

s = _('video_volume'); 
m = _('mute_button'); 

function muteVideo(){ 
    if(v.muted){ 
     v.muted = false; 
     m.innerHTML = 'Mute'; 
    } 
    else{ 
     v.muted = true; 
     m.innerHTML = 'Unmute'; 
     s.value= 0; 
    } 
} 

function changeVolume(){ 
    v.volume = s.value/100; 

    if(v.muted){ 

    } 

} 

:

이

<button id="mute_button" type="button">Mute</button> 
<input type="range" id="video_volume" name="video_volume" min="0" max="100" step="1" value="100"> 

다음 JS 나의 볼륨 범위의 입력 및이 기능과 음소거 버튼을 보여줍니다

지금은 음소거 버튼을 클릭하면 범위가 0으로 설정되어 완벽합니다. 그러나 내가 원하는 것은 다음과 같습니다 :

음소거 해제 버튼을 클릭하면 입력 범위가 이전 볼륨으로 되돌아갑니다.

어떻게하면됩니까? 질문, 감사에 대한

코멘트, 크리스

Answer 1

은 왜 그냥 0으로 설정하기 전에 다른 변수에 볼륨의 값을 저장? 그런 다음 음량이 음소거 해제되면 음량을 이전 값으로 다시 설정하면됩니까?

Here is a quick jsfiddle POC. 나는 당신의 코드에 그것을 아래에 통합하려고 노력할 것이다. (나는 명확성을 위해 여기 document.getElementById를 사용하는거야)

var slider = document.getElementById('video_volume'); 
var cachedVolume; 

function muteVideo(){ 
    if(v.muted){      // User clicked 'Unmute' 
     slider.value = cachedVolume; // set volume to previous value 
     v.muted = false; 
     m.innerHTML = 'Mute'; 
    } 
    else{        // User clicked 'Mute' 
     cachedVolume = slider.value; // store value of volume in another variable 
     v.muted = true; 
     m.innerHTML = 'Unmute'; 

     slider.value= 0; 
    } 
}