如果特定的div在视口中，则淡入音频；如果div不在视口中，则淡出

Question

我有一个滚动页面的网站，我想做的是淡入淡出每个部分的环境声音。我发现有一些库可以使声音以像素为单位淡入淡出，但是由于该站点的扩展性，我无法让它们正确触发。

基本上是每个部分：

<div class="section_content" id="1"> /// this is the section that would need to trigger audio file 1
  <div class="main_image">
  </div>
  <div class="main_content">
  Text content and information here 
  </div>
</div>

<div class="section_content" id="2"> /// this is the section that would need to trigger audio file 2
  <div class="main_image">
  </div>
  <div class="main_content">
  Text content and information here 
  </div>
</div>

https://github.com/kamblack/AudioFade/blob/master/README.md

这是我绑定的库，但是由于它基于像素，因此无法正常工作。