【问题标题】:use Jquery to make absolute positioned object stay fixed on page scroll使用 Jquery 使绝对定位的对象保持固定在页面滚动上
【发布时间】:2011-10-25 14:17:39
【问题描述】:

这基本上是我previous question的延续。

看到我的固定元素无法在响应式环境中发挥作用,我需要以某种方式将一个小的导航菜单绝对定位到包装器。随着窗口的缩放,使用包装器进行缩放,但在滚动时保持固定在顶部。

我想这可以通过 jQuery 实现,但我不确定如何去做。

【问题讨论】:

    标签: jquery responsive-design


    【解决方案1】:

    您应该查看 jquery waypoints 粘性元素http://imakewebthings.github.com/jquery-waypoints/sticky-elements/。这是让元素与常见的窗口滚动事件交互的一种非常干净的方式

    【讨论】:

    • 这比我想象的要难得多。如果您查看:imakewebthings.github.com/jquery-waypoints/#documentation 就在顶部,他们有灰色的小菜单。我正在尝试准确地创建它。滚动时卡在顶部,调整大小时移动
    • 看起来他们这样做的方式是他们将导航包裹在一个 div 中,他们将最大宽度设置为 980px。然后他们将导航浮动在该 div 右侧。这将允许外部 div 在窗口调整大小时变小,从而导致导航在屏幕变小时向左移动。查看 firebug 中这些元素的 css,以更好地了解我在说什么
    • 所以我想通了并创建了一个解决方案,而无需求助于 Javascript,它都是纯 css。如果您对我的解决方案感兴趣,那就是:jsfiddle.net/Diezel23/pEwz2/19 再次感谢那些试图提供帮助的人
    猜你喜欢
    • 1970-01-01
    • 2021-05-22
    • 1970-01-01
    • 2023-03-18
    • 1970-01-01
    • 2017-07-25
    • 2015-05-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多