通过滚动控制音量

I'm making a website for a school project but i have never worked with coding before - so I'm sorry if i have no clue how to phrase my question properly..

I would like to lower the volume of my audio clip when i scroll down on my website. I'm having a hard time understanding the logic of JavaScript... I kinda want to stick to HTML and CSS as much as possible, but i do have to use jQuery for this, right?

I'm hoping some of you might point me in the right direction.. Thanks in advance!

Take a look at this example, hope may help you starting out (scroll on the video):

$(function() {

  var video = $('#myVideo');
  var videoEl = video[0];
  var delta = 0.1; //you can choose whatever delta ( + delta + volume change speed )
  video.on('wheel', function(event) {
    event.preventDefault(); //prevent default page scroll;
    //check for scroll down 
    if (event.originalEvent.deltaY > 0 && videoEl.volume - delta >= 0) {
      videoEl.volume -= delta;
    //check for scroll up 
    } else if(event.originalEvent.deltaY < 0 && videoEl.volume + delta <= 1) {
      videoEl.volume += delta;
    }
  });

})

html {
  padding: 20px 0;
  background-color: #efefef;
}

body {
  width: 400px;
  padding: 40px;
  margin: 0 auto;
  background: #fff;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
}

video {
  width: 400px;
  display: block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<video id="myVideo" autobuffer controls autoplay>
  <source id="mp4" src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4">
</video>

</div>