Javascript MouseWheel Event & Video Volume - Prevent Page Scroll

I'm trying to control a video volume using the MouseWheel, I want to completely disable the page scroll when my mouse is over the video, it works but there's a problem when the vid

Solution 1:

You will want to add a condition to your if statement to turn it up or down like so:

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

DEMO

Solution 2:

If you check the console, the video is throwing an exception when trying to set a volume over the 1.0 value, and it doesn't reach the e.preventDefault()

A try/catch around where you set the volume would fix it.

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