Questions tagged «sidebar»


5
折叠式边栏,带引导装置
我刚刚访问了该页面http://www.elmastudio.de/,想知道是否可以使用Bootstrap 3构建左侧边栏折叠。 从顶部折叠边栏的代码(仅适用于电话): <button type="button" class="navbar-toggle sidebar-toggle" data-toggle="collapse" data-target=".sidebar-ex1-collapse"> <span class="sr-only">Sidebar</span> <span class="glyphicon glyphicon-check"></span> </button> 补充工具栏本身具有hidden-xs类。使用以下js将其删除 $('.sidebar-toggle').click(function(){ $('#sidebar').removeClass('hidden-xs'); }); 如果单击该按钮,则会从顶部切换侧边栏。很高兴看到侧边栏的行为类似于上面显示的网站。任何帮助表示赞赏!

6
粘边栏:向下滚动时固定在底部,向上滚动时固定在顶部
我一直在寻找一段时间,以解决粘性侧栏问题。我对自己的行为有一个特定的想法;实际上,当您向下滚动时,我希望它粘在底部,然后当您向上滚动时,我希望它以流畅的运动(不跳动)粘在顶部。我找不到我要实现的目标的示例,因此我创建了一个图像,希望可以更清楚地说明这一点: 边栏位于标题下方。 向下滚动时,侧栏保持与页面内容的水平,以便您可以滚动浏览侧栏和内容。 到达侧边栏的底部,侧边栏将粘在视口的底部(大多数插件仅允许粘在顶部,有些插件允许粘在底部而不是两者都允许)。 到达底部,侧边栏位于页脚上方。 向上滚动时,侧边栏与内容保持水平,因此您可以再次滚动浏览内容和侧边栏。 到达侧边栏的顶部,侧边栏粘贴到视口的顶部。 到达顶部,边栏位于标题下方。 我希望这是足够的信息。我创建了一个jsfiddle来测试所有插件/脚本,对此问题我已对其进行了重置:http : //jsfiddle.net/jslucas/yr9gV/2/ .

15
使用CSS强制边栏高度100%(底部带有粘性图像)?
数小时以来,我一直在脑海中摸索,试图找出这个问题,并认为这一定是我所缺少的。我已经在网上搜索过,但找不到任何有效的工具。HTML是: <body> <div id="header"> <div id="bannerleft"> </div> <div id="bannerright"> <div id="WebLinks"> <span>Web Links:</span> <ul> <li><a href="#"><img src="../../Content/images/MySpace_32x32.png" alt="MySpace"/></a></li> <li><a href="#"><img src="../../Content/images/FaceBook_32x32.png" alt="Facebook"/></a></li> <li><a href="#"><img src="../../Content/images/Youtube_32x32.png" alt="YouTube"/></a></li> </ul> </div> </div> </div> <div id="Sidebar"> <div id="SidebarBottom"> </div> </div> <div id="NavigationContainer"> <ul id="Navigation"> <li><a href="#">Nav</a></li> <li><a href="#">Nav</a></li> <li><a href="#">Nav</a></li> <li><a href="#">Nav</a></li> <li><a href="#">Nav</a></li> …
76 css  sidebar  sticky 
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.