小编tim*_*myg的帖子

Bootstrap Affix类跳到底部

我已经设法让scrolllspy和affix插件工作得很好,但每当用户滚动到页面底部时(如果使用一个小浏览器窗口),词缀类开始与另一个冲突,并且词缀在状态之间跳转.

这里可以看到一个例子:http://devng.sdss.org/results-science/

CSS是:

.affix-top,.affix{
  position: static;
}

#sidebar li.active {
   border:0 #eee solid;
   border-right-width:5px;
}
@media (min-width: 979px) {
   #sidebar.affix-top {
     position: static;
     margin-top:30px;
   }
   #sidebar.affix {
     position: fixed;
     top:70px;
   }

   #sidebar.affix-bottom {
    position: fixed;
    bottom: 400px;
   }

}
Run Code Online (Sandbox Code Playgroud)

和JS:

$('#leftCol').affix({
           offset: {
             top: 235
             ,bottom: 400
           }
         });

         /* activate scrollspy menu */
         var $body   = $(document.body);
         var navHeight = $('.navbar').outerHeight(true) + 10;

         $body.scrollspy({
           target: '#leftCol',
           offset: navHeight
         });
Run Code Online (Sandbox Code Playgroud)

我觉得答案就在我的面前,但我已经盯着这个太久了,任何额外的眼睛都会受到最多的赞赏.

css jquery twitter-bootstrap affix scrollspy

3
推荐指数
1
解决办法
4014
查看次数

标签 统计

affix ×1

css ×1

jquery ×1

scrollspy ×1

twitter-bootstrap ×1