水平滚动一个固定的页眉/页脚

Question

我有被设定为960像素的最小宽度，并且被固定到页面顶部的头部。当用户缩小窗口的尺寸小于960像素时，将显示水平滚动条，因为它应该。但是，当用户滚动水平，因为一些头被切断，我希望能够以同样的速度在页面滚动头......我非常希望我的头垂直固定，而不是水平。

我看着下面，但是没有帮助：

CSS: fixed position on x-axis but not y?

Centering a fixed element, but scroll it horizontally

Answer 1

我知道这是一个过时的问题，如果你想通了但我不知道，但希望在其他人遇到同样问题的情况下提交答案。

当设置具有最小宽度的内容fixed在CSS，它相对于两轴的窗口锁定。当窗口被调整大小以小于最小宽度，则多余的页眉/页脚被削波并且不能被滚动到。不幸的是，没有办法单独在CSS中改变这种行为。然而，有一个简单的jQuery修复您的问题（假设你已经在页面上的其他内容，将创建水平滚动条）：

$(window).scroll(function() 
    { 
     $("header,footer").css('margin-left', -($(window).scrollLeft()) + "px"); 
    }); 

这将导致页眉和页脚（如适用）移动在x轴上与滚动方向相反，从而达到您想要的效果。