CSS如何修复元素随页面水平滚动而不是垂直滚动？

我创建了一个示例来帮助解释。http://jsfiddle.net/9AUbj/1/ http://jsfiddle.net/9AUbj/1/

<style>
div#one {}
div#two {
    height: 50px;
    background-color: blue;
    width: 1000px;
}
div#three {
    height: 1000px;
}
</style>
...
<div id="one">Hello World!</div>
<div id="two"></div>
<div id="three"></div>

我想要“你好世界！”当用户水平滚动时随窗口水平移动。但是我DON'T当用户垂直滚动时希望它随窗口垂直移动。做这个的最好方式是什么？我正在使用 Bootstrap 和 jQuery UI，以防它们有帮助。不过，我也对纯 CSS 解决方案感兴趣。

提前致谢 ：-） 克特姆

每当您滚动窗口时，请重新定位 #one 元素以使其始终显示在屏幕上。另外，#one 应该是位置：绝对的。

$(window).scroll(function () {
    $("#one").css({
        left: $(this).scrollLeft()
    });
});

这是您对新代码的修改：http://jsfiddle.net/9AUbj/15/ http://jsfiddle.net/9AUbj/15/