当用户开始滚动时,请帮助我将右侧边栏设为静态。我是响应式网页设计的新手。我尝试使用“位置:固定”属性,但我不知道它在响应式设计中的可行性。请帮我。这是链接http://the-bootstrap.obenland.it/page-with-comments/
问问题
327 次
3 回答
1
JSfiddle 适合你 -- JSfiddle 适合你
创建一个这样的类:-
.fixed {
position:fixed;
right:88px; /*insert this aswell*/
}
并将其与下面的侧边栏部分一起使用。
<section role="complementary" class="widget-area span4 fixed" id="secondary">
于 2013-02-17T09:05:59.473 回答
1
如果您希望维护响应式 Web 设计原则,那么简单地应用 position:fixed 将无法解决问题。如果你想让它在较小的屏幕上很好地工作,你必须有条件代码。它必须固定在“正常”屏幕上,当屏幕变得“太小”时,您需要删除该类。您还必须决定“正常”和“太小”对您意味着什么。请参阅此处的示例:
http://home.edgemontgeek.com/dev/stackoverflow/14919523/
请记住,您还需要控制屏幕高度。如果窗口不够大,无法容纳固定内容,他们将无法看到它。您可以考虑有两列可以分别滚动。
于 2013-02-17T09:10:29.263 回答
1
采用
.fixed{
left:0;
position:fixed;
top:Height_of_logo;
}
这将创建一个侧边栏,在顶部为徽标留出空间,但是如果您希望侧边栏在用户向下滚动时向上滑动,然后在徽标超出范围时粘住,那么我建议您使用像这样的 Jquery 插件
http://viget.com/inspire/jquery-stick-em
这个站点有很好的文档和演示。
于 2013-02-17T09:29:44.293 回答