好的,我想使用jQuery Slider元素控制HTML5元素的音量。我已经实现了幻灯片,但无法弄清楚如何使滑块的值代替“audio player.volume =?”。

任何帮助深表感谢。

Source

最佳答案

volume属性就像不透明度一样,介于0和1之间,其中一个为100%。

您的代码是如此接近,您只需在设置value元素的音量时将100除以<audio>:

$("#slider").slider({
    value  : 75,
    step   : 1,
    range  : 'min',
    min    : 0,
    max    : 100,
    change : function(){
        var value = $("#slider").slider("value");
        document.getElementById("audio-player").volume = (value / 100);
    }
});

注意,我还将change事件处理程序放入slider小部件的初始化中。

当我在您的网页上将上述代码粘贴到控制台中时,音量滑块会按预期工作。

另外,您可以绑定(bind)到slide事件,并且音量将随着用户滑动slider小部件而改变,而不仅仅是在他们完成移动 handle 之后:
$("#slider").slider({
    value : 75,
    step  : 1,
    range : 'min',
    min   : 0,
    max   : 100,
    slide : function(){
        var value = $("#slider").slider("value");
        document.getElementById("audio-player").volume = (value / 100);
    }
});

关于javascript - 使用jQuery控制HTML5 <audio>音量,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/9589292/

10-12 12:35
查看更多