用户滚动特定高度时停止音量

Question

我试图制作一个脚本来淡化html5视频的音量。

所以我找到了一个代码来实现它，我做了一些改变以满足我的需求，得到这样的东西。

	var videoMute = $('#myVideo').get(0);
	var heightVideo = parseInt( $("#contents-main").css("marginTop") );
	
	$(document).scroll(function() {
		videoMute.volume = 1 - $(window).scrollTop() / heightVideo;
	});

因此，当用户在内容和视频之间滚动一些margintop时，我试图淡化视频的音量，我尝试计算窗口之间的视频音量滚动顶部和我从内容主要获得的边距。

问题是，当我滚动边距并输入#content-main时，我收到此错误。

    Uncaught DOMException: Failed to set the volume property on HTMLMediaElement: The volume provided -X number is outside the range 0, 1.

也许你可以帮助我解决这个问题，提出一些关于如何在音量减去cero时结束函数的建议，或者可能改变我制定数学公式以获取视频音量的方式。

提前致谢。

Answer 1

问题是这必须介于0和1之间。您最有可能获得负数。在调试器中创建一个断点，看看这个表达式给你带来了什么。还有什么scrollTop和heightVideo变种。

1 - $(window).scrollTop() / heightVideo;

Answer 2

您可以尝试：它将检查音量是否在0和1之间，如果不是，那么当且仅当1 - $（窗口）.scrollTop（）/ heightVideo是正确的方式时，音量将为0体积

var videoMute = $('#myVideo').get(0);
var heightVideo = parseInt( $("#contents-main").css("marginTop") );
	
$(document).scroll(function() {
  var volume = 1 - $(window).scrollTop() / heightVideo;
	videoMute.volume = (volume > 1 || volume < 0) ? 0 : volume;
});