Question

滚动页面内容时是否可以使DIV更大？我有位置的聊天框：固定在我页面的右侧。我的聊天框的CSS是高度：100％正确：0底部：0顶部：50px。顶部：50px是因为我不希望它隐藏在我页面顶部的导航栏。现在问题是，当我开始滚动页面时，导航栏显然从视线中消失，并且我的聊天框顶部有50px高的空白区域。我想要的是，当我开始滚动页面时，聊天框应该占据整个屏幕的100％，这样就不会有空白空间。

Answer 1

你可以这样做：

$(document).ready(function () {
     $(window).scroll(function () {
         if ($(this).scrollTop() > 100) {
             $('.chat_box').css({top:'0px'});
         }
         else {
             $('.chat_box').css({top:'10px'});
         }
    });
});

http://jsfiddle.net/5tnygmrz/1/

Answer 2

演示 - http://jsfiddle.net/victor_007/cq1e8c1t/

我认为你需要javascript

window.onscroll = function (e) {
    var topscroll = window.scrollY
    if (topscroll > 50) {
        document.getElementById('fixed').style.top = 0
    } else {
        document.getElementById('fixed').style.top = 50 + 'px'
    }
}

滚动时使DIV更大

2 个答案: