Audio breakpoints on scroll

112 Views Asked by At

I'm developing a one page website with Skrollr.js plugin. I need to add multiple audio tracks to specific pixel heights and stop these tracks in multiple breakpoints. How can I do that?

I tried with the script below, but I don't know how to add multiple conditions with other breakpoints, tracks, and pixel height.

var playing = false;
var audioTrack = $('#track1').get(0);

window.onscroll = function() {
  var winH = $(window).height();
  var scrollPage = $(window).scrollTop();

  if(!playing && winH >= 768 && scrollPage > 1000 && scrollPage < 3000){
    audioTrack.play();
    playing = true;
  }else if(scrollPage > 3000 || scrollPage < 1000 || winH < 768 ){
    audioTrack.pause();
    audioTrack.currentTime = 0;
    playing = false;
  }
}
0

There are 0 best solutions below