浮动div,当大于窗口高度时应用底部边距

时间:2014-08-14 08:22:54

标签: javascript jquery

我有浮动div,使用js函数动态填充内容。 我正在使用以下代码来使这个div浮动

// Stick the #nav to the top of the window
    var nav = $('#right-div');
    var navHomeY = nav.offset().top;
    var isFixed = false;
    var $w = $(window);
    $w.scroll(function() {
        var scrollTop = $w.scrollTop();
        var shouldBeFixed = scrollTop > navHomeY;
        if (shouldBeFixed && !isFixed) {
            nav.css({
                position: 'fixed',
                top: 0,
                left: nav.offset().left,
                width: nav.width()
            });
            isFixed = true;
        }
        else if (!shouldBeFixed && isFixed)
        {
            nav.css({
                position: 'static'
            });
            isFixed = false;
        }
    });
});

有时当添加足够的内容项时,此div高度大于窗口,而div内容的一部分根本不可见,它会保持低于页边距。

所以我在思考js函数,其中在添加浮动div之前生成内容以计算窗口高度和浮动div并简单地将底部边距应用于浮动div

if ($(window).height() < $("#right-div").height()) {
      alert("float div is larger than window");
      $("#right-div").css({bottom:100});            
}
在firebug上我看到这个应用了底部边距(100px),但仍然隐藏了div内容的一部分。

0 个答案:

没有答案