请在这里找到我的设计:
http://jsfiddle.net/2JGQa/
我想修复左栏(包括testlab_fr,1er mail,…,10eme mail),就像我的标题一样,我怎么能这样做?
我看到了词缀,但我不知道如何使用它.
<div class="row"> <div class="col-sm-4"> <div class="row"> <ul class="list-group"> <li class="list-group-item"> <span class="badge">175</span> testlab_fr </li> </ul> </div> <div class="row"> <div class="list-group"> <a href="http://localhost/mailBox/testlab_fr,26860-html" class="link_mail list-group-item active"> <h4 class="list-group-item-heading">1er mail</h4> <p class="list-group-item-text">il y a 1 hours</p> </a> <a href="http://localhost/mailBox/testlab_fr,25877-html" class="link_mail list-group-item"> <h4 class="list-group-item-heading">10ème mail</h4> <p class="list-group-item-text">il y a 2 heures</p> </a> </div> </div> </div><!-- /.col-sm-4 -->
解决方法
你会在这里找到关于词缀插件的文档:
http://getbootstrap.com/javascript/#affix将你想要加载的元素包装在容器div中(b.e.with id =“subnav”).
通过Javascript或Via数据属性设置此容器的词缀.
javascript:$(‘#subnav’).affix();要么
通过数据属性:< div id =“subnav”data-spy =“affix”>
因为您不希望元素与固定导航栏重叠,您必须设置顶部偏移.顶部偏移量应至少为导航栏的高度.
如果您的设计有一个页脚,您还将设置底部偏移量.因为你不希望粘贴元素与页脚重叠.
Javascript:$(‘#subnav’).affix({offset:{top:150,bottom:150}});要么
通过数据属性:< div id =“subnav”data-spy =“affix”data-offset-top =“150”data-offset-bottom =“150”>
使用CSS将元素添加到文档顶部:.affix {position:fixed; top:0px;}