Waypoint不工作在overflow:hidden; [英] Waypoint not working on overflow:hidden;

查看:152
本文介绍了Waypoint不工作在overflow:hidden;的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

小提琴

Fiddle

如果你从 .wrapper 中删除​​ overflow 属性,那么waypoints会正常工作。


但不是溢出 隐藏 x y

If you remove overflow property from .wrapper in fiddle, waypoints will work fine.
But not with overflow hidden in x or 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解决方案?

Any jQuery or css solution?

推荐答案

UPDATED 2014-05-16

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

Add a waypoint() function binded to the <div> id to make the css changes appear.

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

The context of the waypoint() should be your outer div <div class="wrapper">:

DEMO

DEMO

这篇关于Waypoint不工作在overflow:hidden;的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆