litvinovg/vivo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Smoother scrolling nav bar

Browse source
This commit is contained in:
Graham Triggs 2017-09-23 00:11:29 +01:00
parent 8855405881
commit 765ea4a1a1
2 changed files with 26 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
webapp/src/main/webapp/themes/tenderfoot/templates/page/partials/headScripts.ftl
View file

@ -18,6 +18,8 @@ var i18nStrings = {
<script src="${urls.theme}/bootstrap/js/bootstrap.min.js"></script> <script src="${urls.theme}/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function(){ $(document).ready(function(){
$('#nav-wrapper').height($("#nav").height());
$('#nav').affix({ $('#nav').affix({
offset: { offset: {
top: $('header').height() top: $('header').height()

46
webapp/src/main/webapp/themes/tenderfoot/templates/page/partials/menu.ftl
View file

@ -1,26 +1,28 @@
<#-- $This file is distributed under the terms of the license in /doc/license.txt$ --> <#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
<div id="nav"> <div id="nav-wrapper">
<div class="container"> <div id="nav" data-spy="affix">
<nav class="navbar navbar-default"> <div class="container">
<p class="navbar-text visible-xs-inline-block">Menu</p> <nav class="navbar navbar-default">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation"> <p class="navbar-text visible-xs-inline-block">Menu</p>
<span class="sr-only">Toggle navigation</span> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="icon-bar"></span> <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
</button> <span class="icon-bar"></span>
<div class="collapse navbar-collapse" id="navbarContent"> </button>
<ul id="main-nav" role="list" class="nav navbar-nav mr-auto mt-2 mt-md-0"> <div class="collapse navbar-collapse" id="navbarContent">
<#list menu.items as item> <ul id="main-nav" role="list" class="nav navbar-nav mr-auto mt-2 mt-md-0">
<li class="nav-item" role="listitem" <#if item.active> class="active" </#if>><a href="${item.url}" title="${item.linkText} ${i18n().menu_item}" class="nav-link">${item.linkText}</a></li> <#list menu.items as item>
</#list> <li class="nav-item" role="listitem" <#if item.active> class="active" </#if>><a href="${item.url}" title="${item.linkText} ${i18n().menu_item}" class="nav-link">${item.linkText}</a></li>
</ul> </#list>
<ul class="nav pull-right navbar-nav"> </ul>
<li> <ul class="nav pull-right navbar-nav">
<#include "search.ftl"> <li>
</li> <#include "search.ftl">
</ul> </li>
</nav> </ul>
</nav>
</div>
</div> </div>
</div> </div>