Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-19 20:04:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add top bottom navbar toggle

Browse Source
This commit is contained in:
Jeremy Thomas
2017-10-24 12:23:31 +01:00
parent 0e6e22e70a
commit c0639cde83
13 changed files with 326 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
docs/lib/navbar.js Normal file
View File

@@ -0,0 +1,46 @@
'use strict';
document.addEventListener('DOMContentLoaded', function () {
var rootEl = document.documentElement;
var navbarTopEl = document.getElementById('navbar');
var navbarBottomEl = document.getElementById('navbarBottom');
var fixTopEl = document.getElementById('navbarFixTop');
var fixTopElIcon = fixTopEl.querySelector('.fa');
var fixBottomEl = document.getElementById('navbarFixBottom');
var fixBottomElIcon = fixBottomEl.querySelector('.fa');
var fixedTop = false;
var fixedBottom = false;
fixTopEl.addEventListener('click', function (event) {
fixedTop = !fixedTop;
if (fixedTop) {
fixTopEl.className = 'button is-success';
fixTopElIcon.className = 'fa fa-check-square-o';
rootEl.classList.add('has-navbar-fixed-top');
navbarTopEl.classList.add('is-fixed-top', 'has-shadow');
} else {
fixTopEl.className = 'button is-link';
fixTopElIcon.className = 'fa fa-square-o';
rootEl.classList.remove('has-navbar-fixed-top');
navbarTopEl.classList.remove('is-fixed-top', 'has-shadow');
}
});
fixBottomEl.addEventListener('click', function (event) {
fixedBottom = !fixedBottom;
if (fixedBottom) {
fixBottomEl.className = 'button is-success';
fixBottomElIcon.className = 'fa fa-check-square-o';
rootEl.classList.add('has-navbar-fixed-bottom');
navbarBottomEl.classList.remove('is-hidden');
} else {
fixBottomEl.className = 'button is-link';
fixBottomElIcon.className = 'fa fa-square-o';
rootEl.classList.remove('has-navbar-fixed-bottom');
navbarBottomEl.classList.add('is-hidden');
}
});
});