航点在溢出时不起作用：隐藏；答案

【问题标题】：Waypoint not working on overflow:hidden;航点在溢出时不起作用：隐藏；
【发布时间】：2014-05-09 11:03:53
【问题描述】：

如果您在小提琴中从.wrapper 中删除overflow 属性，航点将正常工作。
但不适用于overflow hidden 在x 或y

代码如下：

HTML：

<div class="wrapper">
    <div id="sec1" class="section">dfa fdasfsdafd as</div>
    <div id="sec2" class="section">dfa fdasfsdafd as</div>
    <div id="sec3" class="section">dfa fdasfsdafd as</div>
    <div id="sec4" class="section">dfa fdasfsdafd as</div>
</div>

CSS：

html, body, .wrapper, .section{
    height:100%;
}
.wrapper{
    overflow-x: hidden;
    overflow-y: auto;
}

JS：

$('#sec3').waypoint(function(direction) {
    $('#sec3').css({
        backgroundColor: "#f99"
    });
});

任何 jQuery 或 css 解决方案？

【问题讨论】：

哇为什么投反对票？
您需要在此处发布重现该问题的代码。 stackoverflow.com/help/how-to-ask
@JamieBarker 我知道他发布了一个小提琴，哈哈。根据我发布的链接，他需要在此处发布代码以重现该问题。
@JamieBarker 代码应该贴在这里。该链接很好，但如果 jsfiddle 关闭，则此页面将无用。问题和答案应该是自包含的，足以使 Stack Overflow 无需外部资源即可工作。你来的时间不长，所以我不会说 facepalm 这么粗鲁。请不要采取幼稚的态度。这个网站不是那样的。
@Archer 我想我会同意的，下次我一定会发布代码谢谢:)

标签： jquery css jquery-waypoints

【解决方案1】：

2014 年 5 月 16 日更新

添加绑定到<div> id 的waypoint() 函数以使css 更改出现。

waypoint() 的上下文应该是你的外部 div <div class="wrapper">：

DEMO

【讨论】：

谢谢@urbz -- 如果我是正确的，你在这里所做的是每次用户在该 div 中滚动时刷新航点功能...？
很高兴为您提供帮助！ :) scroll() 函数在您到达该元素时执行 waypoint() 函数，因为您指定了 <div> 它应该更改样式的对象。
@urbz - 无话可说，太棒了
我不确定你的意思，但滚动听起来像是一场等待发生的灾难，每次滚动都会启动数百个航点。您应该使用context 选项使可滚动元素航点侦听包装器而不是主体。
@imakewebthings 你说得对，我使用了context 方法，性能差异是200% DEMO