javascript - 如果 slider 类处于事件/可见状态，则更改主体类

Question

我有一个 Webflow slider (可能与任务无关)，如果存在具有“switch-nav”类的特定幻灯片，则需要更改“body”的类。目前，我已经尝试了各种方法，许多方法最初会添加主体类，但当带有“switch-nav”类的 slider 超出 View /我们移动到下一张没有该类的幻灯片时，不会将其删除。这是一般的幻灯片标记:-

<div class="slide switch-nav w-slide" style=transform: translateX(-4500px); opacity: 1; visibility: hidden;"></div>
<div class="slide image-2 w-slide" style="transform: translateX(-4500px); opacity: 1; z-index: 1; visibility: hidden;"></div>
<div class="slide image-3 w-slide" style="transform: translateX(-4500px); opacity: 1; z-index: 3; transition: opacity 800ms; -webkit-transition: opacity 800ms;"></div>

理想情况下，这将触发该类是否在视口(viewport)中，因为我希望通过类开关更改“页面”导航。

Answer 1

我不确定您是否已经尝试过，但是 jQuery 有一个可见性选择器。

if $('.switch-nav').is(":visible") {
    $(this).addClass('visibleClass');
}
else {
    $(this).removeClass('visibleClass');
}