解决方案：使用 jQuery 滚动时保持元素在视图中

Question

我必须在滚动时保持元素在视图中。我已经做到了，它在所有浏览器中都能正常工作，但在分辨率方面却不佳。

   $(function() {
            var offset = $(".sysIcons").offset();
            var topPadding = 15;
            $(window).scroll(function() {
                if ($(window).scrollTop() > offset.top) {
                    $(".sysIcons").stop().animate({
                        marginTop: $(window).scrollTop() - offset.top + topPadding
                    });
                } else {
                    $(".sysIcons").stop().animate({
                        marginTop: 0
                    });
                };
            });
        });

它在 1024 x 768、1280 x 735 下工作正常，

但在 1360X768 下则不然， - 问题是滚动到窗口末尾时，它不会停止。滚动时连续动画。

请帮帮我

Answer 1

您不需要 jQuery 在滚动时获取视图中的元素，您可以使用 CSS position 属性使其始终显示，包括滚动：

#elementID {
  position:fixed;
  /* more styles */
}

position:fixed 不起作用在 IE6 中，但现在谁关心它:)

Answer 2

这可能会满足您的需求。

http://imakewebthings.com/waypoints/shortcuts/sticky-elements/
主站点： http://imakewebthings.github.com/jquery-waypoints/
Github：https://github.com/imakewebthings/waypoints

Answer 3

如果您不关心 IE6，可以使用 position:fixed。