为HTML5视频创建自定义音量控件时出现问题 [英] Problems creating a custom volume control for HTML5 Video

问题描述

我有一个相当复杂的项目，需要自定义音量滑块来控制HTML5视频元素。我把音量控制简化为一个非常简单的例子，我认为没有理由说它不应该工作。我很想知道以下代码的任何见解：

I have a fairly complex project in the works that requires a custom volume slider to control an HTML5 video element. I've boiled the volume control down to a very simple example and I see no reason why it should not be working. I would love any insight regarding the following code:

jQuery：

<script>
$(function() {
    $('#volume').change(function () {
        newvolume = $('#volume').attr("value") / 100;
        $('#video').attr("volume", newvolume);
        console.log($('#video').attr("volume"));
    });
});
</script>

HTML：

<video id="video" controls="controls">
    <source src="http://dev.domain.com/media/16514.m4v">
</video>

<input id="volume" type="range" min="0" max="100" value="100" />

应该注意的是，除了视频音量发生变化外，其他方面似乎都有效夹。甚至console.log结果返回正确的值（0到1.00）我也尝试了严格的Javascript版本，即 videoElement.volume = newvolume

It should be noted that every aspect of this appears to work except an audible change in volume on the video clip. Even the console.log result is returning the correct value (0 through 1.00) I have also tried the strictly Javascript version of this, i.e. videoElement.volume = newvolume

如果它很重要，我在Safari 5.1.2中测试。

If it's significant, I am testing in Safari 5.1.2.

推荐答案

$（'＃video'）。attr（volume，newvolume）; ，试试这个：

$('#video')[0].volume = newvolume;

如果内存服务， volume 不是HTML5中 video 的属性，只能通过DOM元素本身访问。

If memory serves, volume is not an attribute of video in HTML5, it is only accesible via the DOM element itself.

这篇关于为HTML5视频创建自定义音量控件时出现问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！