Question

我正在尝试使用MouseWheel控制视频音量，
当鼠标悬停在视频上时，我想完全禁用页面滚动，
它的工作原理但是当视频的音量达到最小值时会出现问题。最高等级：
页面滚动开始......如果鼠标悬停在视频上，我不希望页面滚动！
其实我正在尝试使用chrome：

var popo = document.getElementById('popo');
var coco = document.getElementById('coco');
//popo.play();

//setTimeout(function(){
//    popo.pause();
//},3000);

var current = 0;
var doScroll = function (e) {
    // cross-browser wheel delta
    e = window.event || e;
    var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));

    // Do something with `delta`
    current = current + delta;
    coco.innerHTML = current;

    if(delta== 1){popo.volume+=0.1;}
    if(delta== -1){popo.volume-=0.1;}

    e.preventDefault();
};

if (popo.addEventListener) {
   popo.addEventListener("mousewheel", doScroll, false);
    popo.addEventListener("DOMMouseScroll", doScroll, false);
} else {
    popo.attachEvent("onmousewheel", doScroll);
}

JSFiddle DEMO：http://jsfiddle.net/NSjqd/5/

Answer 1

您需要在if语句中添加一个条件，以便将其打开或关闭：

if(delta== 1 && popo.volume <= 0.9){popo.volume+=0.1;}
if(delta== -1 && popo.volume > 0.1){popo.volume-=0.1;}

DEMO

Answer 2

如果您检查控制台，视频在尝试将音量设置为1.0以上时会抛出异常，并且它没有到达e.preventDefault（）

尝试/捕捉你设置音量的位置会修复它。

try {
  if(delta== 1){popo.volume+=0.1;}
  if(delta== -1){popo.volume-=0.1;}
} catch(e) {}

javascript MouseWheel事件＆amp;视频音量 - 阻止页面滚动

2 个答案: