Skip to content

Commit

Permalink
Added support for navbar-fixed-bottom
Browse files Browse the repository at this point in the history
  • Loading branch information
Jim Karg committed Oct 3, 2014
1 parent ac97824 commit 02bc9e2
Show file tree
Hide file tree
Showing 3 changed files with 89 additions and 57 deletions.
72 changes: 44 additions & 28 deletions dist/jquery.bootstrap-autohidingnavbar.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,23 +8,23 @@
*/
;(function($, window, document, undefined) {
var pluginName = 'autoHidingNavbar',
$window = $(window),
$document = $(document),
_scrollThrottleTimer = null,
_resizeThrottleTimer = null,
_throttleDelay = 70,
_lastScrollHandlerRun = 0,
_previousScrollTop = null,
_windowHeight = $window.height(),
_visible = true,
_hideOffset,
defaults = {
disableAutohide: false,
showOnUpscroll: true,
showOnBottom: true,
hideOffset: 'auto', // "auto" means the navbar height
animationDuration: 200
};
$window = $(window),
$document = $(document),
_scrollThrottleTimer = null,
_resizeThrottleTimer = null,
_throttleDelay = 70,
_lastScrollHandlerRun = 0,
_previousScrollTop = null,
_windowHeight = $window.height(),
_visible = true,
_hideOffset,
defaults = {
disableAutohide: false,
showOnUpscroll: true,
showOnBottom: true,
hideOffset: 'auto', // "auto" means the navbar height
animationDuration: 200
};

function AutoHidingNavbar(element, options) {
this.element = $(element);
Expand All @@ -39,9 +39,18 @@
return;
}

autoHidingNavbar.element.addClass('navbar-hidden').animate({
top: -autoHidingNavbar.element.height()
}, {
var align = {};
if (autoHidingNavbar.element.hasClass('navbar-fixed-top')) {
align = {
top: -autoHidingNavbar.element.height()
};
} else if (autoHidingNavbar.element.hasClass('navbar-fixed-bottom')) {
align = {
bottom: -autoHidingNavbar.element.height()
};
}

autoHidingNavbar.element.addClass('navbar-hidden').animate(align, {
queue: false,
duration: autoHidingNavbar.settings.animationDuration
});
Expand All @@ -56,9 +65,18 @@
return;
}

autoHidingNavbar.element.removeClass('navbar-hidden').animate({
top: 0
}, {
var align = {};
if (autoHidingNavbar.element.hasClass('navbar-fixed-top')) {
align = {
top: 0
};
} else if (autoHidingNavbar.element.hasClass('navbar-fixed-bottom')) {
align = {
bottom: 0
};
}

autoHidingNavbar.element.removeClass('navbar-hidden').animate(align, {
queue: false,
duration: autoHidingNavbar.settings.animationDuration
});
Expand All @@ -67,7 +85,7 @@

function detectState(autoHidingNavbar) {
var scrollTop = $window.scrollTop(),
scrollDelta = scrollTop - _previousScrollTop;
scrollDelta = scrollTop - _previousScrollTop;

_previousScrollTop = scrollTop;

Expand All @@ -79,8 +97,7 @@
if (autoHidingNavbar.settings.showOnUpscroll || scrollTop <= _hideOffset) {
show(autoHidingNavbar);
}
}
else if (scrollDelta > 0) {
} else if (scrollDelta > 0) {
if (!_visible) {
if (autoHidingNavbar.settings.showOnBottom && scrollTop + _windowHeight === $document.height()) {
show(autoHidingNavbar);
Expand Down Expand Up @@ -109,8 +126,7 @@
$document.on('scroll.' + pluginName, function() {
if (new Date().getTime() - _lastScrollHandlerRun > _throttleDelay) {
scrollHandler(autoHidingNavbar);
}
else {
} else {
clearTimeout(_scrollThrottleTimer);
_scrollThrottleTimer = setTimeout(function() {
scrollHandler(autoHidingNavbar);
Expand Down
2 changes: 1 addition & 1 deletion dist/jquery.bootstrap-autohidingnavbar.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

72 changes: 44 additions & 28 deletions src/jquery.bootstrap-autohidingnavbar.js
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
;(function($, window, document, undefined) {
var pluginName = 'autoHidingNavbar',
$window = $(window),
$document = $(document),
_scrollThrottleTimer = null,
_resizeThrottleTimer = null,
_throttleDelay = 70,
_lastScrollHandlerRun = 0,
_previousScrollTop = null,
_windowHeight = $window.height(),
_visible = true,
_hideOffset,
defaults = {
disableAutohide: false,
showOnUpscroll: true,
showOnBottom: true,
hideOffset: 'auto', // "auto" means the navbar height
animationDuration: 200
};
$window = $(window),
$document = $(document),
_scrollThrottleTimer = null,
_resizeThrottleTimer = null,
_throttleDelay = 70,
_lastScrollHandlerRun = 0,
_previousScrollTop = null,
_windowHeight = $window.height(),
_visible = true,
_hideOffset,
defaults = {
disableAutohide: false,
showOnUpscroll: true,
showOnBottom: true,
hideOffset: 'auto', // "auto" means the navbar height
animationDuration: 200
};

function AutoHidingNavbar(element, options) {
this.element = $(element);
Expand All @@ -31,9 +31,18 @@
return;
}

autoHidingNavbar.element.addClass('navbar-hidden').animate({
top: -autoHidingNavbar.element.height()
}, {
var align = {};
if (autoHidingNavbar.element.hasClass('navbar-fixed-top')) {
align = {
top: -autoHidingNavbar.element.height()
};
} else if (autoHidingNavbar.element.hasClass('navbar-fixed-bottom')) {
align = {
bottom: -autoHidingNavbar.element.height()
};
}

autoHidingNavbar.element.addClass('navbar-hidden').animate(align, {
queue: false,
duration: autoHidingNavbar.settings.animationDuration
});
Expand All @@ -48,9 +57,18 @@
return;
}

autoHidingNavbar.element.removeClass('navbar-hidden').animate({
top: 0
}, {
var align = {};
if (autoHidingNavbar.element.hasClass('navbar-fixed-top')) {
align = {
top: 0
};
} else if (autoHidingNavbar.element.hasClass('navbar-fixed-bottom')) {
align = {
bottom: 0
};
}

autoHidingNavbar.element.removeClass('navbar-hidden').animate(align, {
queue: false,
duration: autoHidingNavbar.settings.animationDuration
});
Expand All @@ -59,7 +77,7 @@

function detectState(autoHidingNavbar) {
var scrollTop = $window.scrollTop(),
scrollDelta = scrollTop - _previousScrollTop;
scrollDelta = scrollTop - _previousScrollTop;

_previousScrollTop = scrollTop;

Expand All @@ -71,8 +89,7 @@
if (autoHidingNavbar.settings.showOnUpscroll || scrollTop <= _hideOffset) {
show(autoHidingNavbar);
}
}
else if (scrollDelta > 0) {
} else if (scrollDelta > 0) {
if (!_visible) {
if (autoHidingNavbar.settings.showOnBottom && scrollTop + _windowHeight === $document.height()) {
show(autoHidingNavbar);
Expand Down Expand Up @@ -101,8 +118,7 @@
$document.on('scroll.' + pluginName, function() {
if (new Date().getTime() - _lastScrollHandlerRun > _throttleDelay) {
scrollHandler(autoHidingNavbar);
}
else {
} else {
clearTimeout(_scrollThrottleTimer);
_scrollThrottleTimer = setTimeout(function() {
scrollHandler(autoHidingNavbar);
Expand Down

0 comments on commit 02bc9e2

Please sign in to comment.