Question

我这样做是否正确？因为它不起作用... $('#page').css('padding-top': ($headerHeight + 'px')); $headerHeight来自var headerHeight = header.height();。

我正在尝试计算#header的高度并将其设置为#page

的填充顶部

//Sticky header on offset
var header = document.querySelector('#header.sticky');
var headerOffset = header.offsetTop;
var headerHeight = header.height();
function scroll () {
    if ($(window).scrollTop() >= headerOffset) {
        $('#header').css({'position':'fixed','top':'0','left':'0','right':'0','z-index':'9999',});
        $('#page').css('padding-top': ($headerHeight + 'px'));
    } else {
        $('#header').css({'position':'relative'});
        $('#page').css('padding-top': '0');
    }
} document.onscroll = scroll;

这是一个小提琴：http://jsfiddle.net/f4LPz/3/

Answer 1

jQuery .css（）需要键值对的普通对象，而且$ headerHeight不是变量的名称，＆＃34; headerHeight＆＃34;是。所以你应该改变：

$('#page').css('padding-top': ($headerHeight + 'px'));

由：

$('#page').css({'padding-top': (headerHeight + 'px')});

这种改变应该做的工作。

最佳。

Answer 2

height()是一个jquery方法，所以它应该是：

var $headerHeight = $(header).height();

padding-top值是从.height动态生成的

2 个答案:

jsFiddle