Div固定到顶部但仍可水平滚动

Question

我想将网页的标题修改为顶部，例如使用position：fixed;在CSS中，但如果浏览器小于标题的1000px宽度，我希望它可以与页面的其余部分一起水平滚动。

当然我可以使用javascript来结合绝对定位来改变div的最高值，但我的偏好是让没有javascript的人可以访问该功能。谢谢！

Answer 1

对不起，没有办法。您也可以将其固定并水平滚动，如下所示：

$(window).scroll(function(){
    var leftScroll = $(document).scrollLeft();
    $('.fixedElement').css({'margin-left':-leftScroll});
});

Answer 2

默认情况下会水平滚动，但我认为您可能需要垂直滚动内容。

您可以使用CSS Media Queries实现此目的。

@media all and (max-width: 1000px) {
    #header {
        position: static;
    }
}

http://jsbin.com/UGasor/1

Answer 3

页眉固定在页面顶部并在小尺寸上水平滚动（此处，尺寸小于600px宽）

header{
    position:fixed;
    top:0px;
    width:100%;
    overflow-x:auto;
}
div{
    width:100%;
    min-width:600px;
}

<header>
    <div> [ content ] </div>
</header>

http://jsfiddle.net/daCrosby/USMgD/