Question

显示/隐藏div使用jquery在div wrapper为position:fixed时无法正常工作，但如果，则更改为position:relative show / hide {{1 }} 回去工作。

这是div div未显示的fiddle of position:fixed。

show/hide

有人有想法......

Answer 1

那是因为你的代码在这里

$(document).scroll(function(){

因此，如果您滚动scroll function或document，body将有效，但由于您使用的是position: fixed，scrollbar中的body {1}}，但scrollbar位于

<div id="right">
    ...
</div>

这使scroll function永远不会被调用，因此您需要更改

$(document).scroll(function(){
    ...
});

到

$("#right").scroll(function(){    // Depend on the container that use the position: fixed;
    ...
});

这是Updated Fiddle

Answer 2

原因是fixed位置自动设置left和top 0，但relative位置设置为父标记的相对位置。

设置下面的css应该可以解决问题：

top:20px

Answer 3

我的猜测是#right{position: relative/fixed }对行为有影响。

position: fixed：元素相对于浏览器窗口定位。

position: relative：元素相对于其正常位置定位。

Answer 4

将滚动条绑定到div#right

$("#right").scroll(function () {
    console.log("scrolling")
    var vis = ($(document).scrollTop() > ($('.passedMe').offset().top + $('.passedMe').height()));
     $('.showHide').css('display', vis?'':'none')
});

显示/隐藏div jquery无法在固定位置工作

4 个答案:

DEMO