【发布时间】:2015-03-09 21:05:20
【问题描述】:
我一直在努力让scrollspy工作。我目前正在做一个由yeomans angular generator 和angular-ui router 搭建的项目。看来我在使用任何数据间谍的东西时运气不好。
谁能看看可能是什么原因?
代码 sn-ps:
index.html
<nav class="navbar navbar-fixed-top navbar-default">
<div class="container">
.. omitted
<div id="char-nav" class="collapse">
<ul class="nav nav-tabs">
<li class=""><a href="#char-identity">Identity</a></li>
<li class=""><a href="#char-attributes">Attributes</a></li>
<li class=""><a href="#char-skills">Skills</a></li>
<li class=""><a href="#char-spells">Spells</a></li>
<li class=""><a href="#char-passives">Passives</a></li>
<li class=""><a href="#char-equipment">Equipment</a></li>
<li class=""><a href="#char-consumables">Consumables</a></li>
</ul>
</div>
</div>
</nav>
...
<div class="container">
<div class="row row-offcanvas row-offcanvas-right">
<div class="col-xs-12 col-sm-9">
<my-notification></my-notification>
<div ui-view></div>
</div>
...omitted
character.html
<div id="character-views" data-offset-top="0" data-spy="scroll" data-target="#char-nav">
<div class="character-view" ng-include="'views/character/identity.html'"></div>
<div class="character-view" ng-include="'views/character/attributes.html'"></div>
<div class="character-view" ng-include="'views/character/skills.html'"></div>
<div class="character-view" ng-include="'views/character/spells.html'"></div>
<div class="character-view" ng-include="'views/character/passives.html'"></div>
<div class="character-view" ng-include="'views/character/equipment.html'"></div>
<div class="character-view" ng-include="'views/character/consumables.html'"></div>
</div>
角色页面由几个部分组成,这是我想窥探的页面。
我的 ng-includes 列表中的任何页面都以这样的标题开头:
<header id="char-identity" class="character-view-header">Identity</header>
<hr>
【问题讨论】:
-
按什么顺序加载 JS 库?即,scrollspy 是否有可能在加载角度部分之前构建其功能?另外,您是否像引导文档所说的那样应用相对定位? getbootstrap.com/javascript/#scrollspy
-
它按如下方式加载:jquery.js -> angular.js -> bootstrap.js -> more.. 编辑:我已经为 div #character-views 提供了 position: relative;是的。
标签: javascript angularjs twitter-bootstrap scrollspy