jQuery - 如何使固定的div在垂直滚动后水平滚动

Question

这有点像以下内容，但有些不同：如何使用jQuery使一个固定位置的div随内容水平滚动？ 这是我的变化：http://jsfiddle.net/Bdwc4/ 基本上，我想能够在div的最右边看到那个"x"，为了做到这一点，div必须是绝对定位的。但同时，我需要在垂直滚动时将div固定。换句话说，在垂直或水平滚动时，您应该始终能够看到该固定位置上的"x"。它在你在窗口顶部时可以实现我想要的效果，但我想能够水平滚动，无论垂直滚动到哪里。 如果您选择不使用上面的jsfiddle，则以下是我正在使用的代码：

<style>
.scroll_fixed {
    left:500px;
    position:absolute
}
.scroll_fixed.fixed {
    position:fixed
} 
.x { float:right }

.foo { background-color: red; width: 150px; height:150px; left:500px }
body { width: 500px }
.header { margin-top: 100px }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script>
$(window).scroll(function(event) {
    var x = 0 - $(this).scrollLeft();
    var y = $(this).scrollTop();

    // whether that's below the form
    if (y) {
        // if so, ad the fixed class
        $('.scroll_fixed').addClass('fixed');
    } else {
        // otherwise remove it
        $('.scroll_fixed').removeClass('fixed');
    }  
});
</script>
<div class="header"></div>
<div class="scroll_fixed foo"><div class="x">x</div></div>
<div>
    Enter a very long string of text
</div>

在输入代码后，将浏览器窗口水平和垂直缩小，直到红框中的“x”不可见，这将强制您水平滚动以查看它。当您垂直滚动时，红框应保持固定位置。

- James Nine

Answer 1

看起来这就是你想要的：http://css-tricks.com/scrollfollow-sidebar/。它与滚动条有关，可以让侧边栏始终保持在页面的某个位置。

- user194919

---

是的！这正是我正在寻找的！很好的发现，谢谢！ - James Nine

Answer 2

看这个网址

http://ryanfait.com/position-fixed-ie6/

- Yanni