0

我正在尝试找到一种显示 div 的方法，allays 对用户可见。滚动..这是我的问题，请参阅：

http://jsfiddle.net/makypl/966Uy/1/

向下滚动时，此 div 应位于 div.left2 下方，向上滚动时应返回原始位置。

    <div id="wrapper">
    <div id="l">
        <div class="left">
            <p class="trigger">Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1 Lorem...1</p>
        </div>
        <div class="left2">
            <p class="trigger">Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2 Lorem...2</p>
        </div>
        <div class="thisone">
            <p>This one should stay always visible
                <p>
        </div>
    </div>
    <div class="right">
        <p>Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem... Lorem...</p>

    </div>
</div>

欢迎任何建议谢谢

4

2 回答 2

11

使用引导词缀，这里是一个例子：http ://bootply.com/62673

于 2013-07-22T14:05:09.727 回答
7 
var top = $('.thisone').offset().top;
$('.trigger').click(function () {
    $('.thisone').css('position','');  
    $('.left2').toggle('slow',function(){
        top = $('.thisone').offset().top;
    });

});



$(document).scroll(function(){
    //calculating the minimal top position of the div
    $('.thisone').css('position','');
    top = $('.thisone').offset().top;

    $('.thisone').css('position','absolute');                 
    $('.thisone').css('top',Math.max(top,$(document).scrollTop()));
 });

这应该可以解决问题。 http://jsfiddle.net/966Uy/11/

编辑： 做了一些调整，如果用户在动画期间滚动，可能会出现错误。

于 2013-07-22T14:07:55.027 回答