javascript - 航点删除类

标签 javascript jquery html css jquery-waypoints

我正在使用 waypoints.js 来处理带有突出显示导航的单页网站。如果视口(viewport)达到“内容”类,导航点将获得“事件”类。该脚本到目前为止工作正常。我想要实现的是,如果 .content 元素离开视口(viewport),类 .active 应该从导航点(.content-nav-point )。

$('.content').waypoint(function() {
    $( '.content-nav-point' ).toggleClass('active');
}, { offset: '0%' });

最佳答案

我相信这会为您解决问题。通过传递 direction 参数,您可以使用滚动方向来添加/删除类。

$('.content').waypoint(函数(方向){ 如果(方向=='向下'){ $( '.content-nav-point' ).addClass('active'); } 别的 { $( '.content-nav-point' ).removeClass('active'); } $( '.content-nav-point' ).toggleClass('active'); }, { 偏移量:'0%' });

但是,我认为您的偏移选项不会帮助您检查元素是否已离开视口(viewport)。您需要修改您的函数以使用航点的 Inview 快捷方式而不是偏移量。在这里查看更多信息:http://imakewebthings.com/waypoints/shortcuts/inview/

关于javascript - 航点删除类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33725815/

相关文章:

javascript - jQuery UI 自动完成的问题

html - CSS以不同方式定位具有相同类的两个元素

html - Angular Material 中的 img 标签内的 md-tooltip

jquery - 为什么 Chosen Select DropDown 位于页脚 DIV 下方

javascript - YouTube:点击按钮即可播放YouTube视频

javascript - Meteor wrapAsync/Node Fiber Future 不工作

jquery - 如何让按钮恢复到 jQuery 中的默认状态

jquery - 如何检索类的属性

javascript - 延迟加载模块每次加载时都会创建父服务的多个实例

jquery - 从表元素而不是整个表单序列化