Javascript 仅当滑块在浏览器窗口中可见时，旋转滑块才会播放

我在页面上有两个滑块。 第一个在页面加载时始终可见（在顶部），第二个在页面底部

我需要使第二个滑块仅在可见（滚动）时开始播放。 我得到：

（函数（）{
var win、slider、sliderHeight、sliderPaused、winHeight；
//将此处的“revapi1”部分更改为滑块使用的任何“revapi”名称
slider=revapi1.on（'revolution.slide.onload'，function（）{
win=jQuery（窗口）。on（'scroll'，checkScroll）。on（'resize'，sizer）；
sizer（）；
});
函数sizer（）{
sliderHeight=slider.height（）；
winHeight=win.height（）；
checkScroll（）；
}
函数checkScroll（）{
var scrTop=win.scrollTop（），
偏移量=滑块。偏移量（）。顶部；
如果（偏移量=scrTop）{
如果（sliderPaused）slider.revresume（）；
sliderPaused=false；
}否则{
如果（！sliderPause）slider.revpause（）；
sliderPaused=true；
}
}
})();

我曾尝试使用此代码（我已经将

revapi1

更改为我的滑块id），但它似乎不起作用

---

是否有人有可行的解决方案或可以帮助我修复当前的代码？

您必须检查滑块是否在视口中

$(window).scroll(function() {
  var windowPosition = $(window).scrollTop();
  var slidePosition = $("#your-slide").offset().top;

  if (slidePosition < windowPosition) {
    // add code here to play slider
  }
}

$（窗口）。滚动（函数（）{
var windowPosition=$（window.scrollTop（）；
var slidePosition=$（“#您的幻灯片”）.offset（）.top；
如果（滑动位置<窗口位置）{
//在此处添加代码以播放滑块
}
}

你能解释一下吗？这个代码放在哪里？$（“你的幻灯片”）就像$（“revapi6”）？我怎么能找到它？或者类似的东西：rev_slider_6_2_wrapper？我不知道js..能帮我吗？#你的幻灯片是滑块所在的div的名称。你必须知道基本的js来实现它。你发布的代码看起来不错，所以检查你的控制台输出是否有任何错误。否则很难判断出哪里出了问题。在“sizer（）”函数添加一行“console.log（'busy with sizer（））；”，这样你就可以检查你的控制台是否真的被调用了。如果没有，那么现在是时候检查你把上面的代码放在哪里了，我想这是在滑块的js中？

$(window).scroll(function() {
  var windowPosition = $(window).scrollTop();
  var slidePosition = $("#your-slide").offset().top;

  if (slidePosition < windowPosition) {
    // add code here to play slider
  }
}