/
reveal-bar.js
107 lines (90 loc) · 2.83 KB
/
reveal-bar.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
/*!
* reveal-bar
* v0.1.0
*
* Inspiration, various code, and credit goes to:
* scroll-up-bar - https://github.com/eduardomb/scroll-up-bar
*/
(function($) {
'use strict';
var destroyRevealBar;
$.revealbar = function($bar, options) {
options = $.extend({
onAttach: $.noop,
onDetach: $.noop,
onShow: $.noop,
onHide: $.noop,
bottomOffset: 0
}, options);
var $window = $(window),
$document = $(document),
lastPosition = $window.scrollTop(),
initialBarPosition = $bar.offset().top,
isiOS = /(iPad|iPhone|iPod)/g.test(navigator.userAgent);
// Get out if on iOS because it sucks
if (isiOS) return;
$window.on('scroll.revealbar', function() {
var currentPosition = $window.scrollTop(),
barFullHeight = $bar.outerHeight(),
barOffsetHeight = barFullHeight - options.bottomOffset,
barTopPosition = $bar.offset().top;
// Ignore elastic scrolling
if (currentPosition < 0 || currentPosition > ($document.height() - $window.height())) return;
// Scrolling up
if (currentPosition < lastPosition) {
if (currentPosition === 0) {
options.onAttach();
} else {
if ($bar.css('position') === 'fixed' && currentPosition > barTopPosition) {
$bar.css({
'position': 'absolute',
'top': barTopPosition + 1
});
} else if ($bar.css('position') === 'absolute' && currentPosition <= barTopPosition) {
options.onShow();
$bar.css({
'position': 'fixed',
'top': 0
});
};
};
// Scrolling down
// or, Page Load not at top
} else if (currentPosition > lastPosition || (currentPosition === lastPosition && currentPosition !== 0)) {
if (currentPosition > barTopPosition + barOffsetHeight) {
options.onDetach();
options.onHide();
$bar.css({
'position': 'fixed',
'top': -barOffsetHeight
});
} else if (currentPosition !== barTopPosition + barOffsetHeight) {
$bar.css({
'position': 'absolute',
'top': barTopPosition
});
};
};
// Remember current position as last position
lastPosition = currentPosition;
});
// Trigger
$window.trigger('scroll.revealbar');
// Destroy/reset bar to initial state
destroyRevealBar = function() {
$window.off('.revealbar');
options.onAttach();
$bar.css({
'position': 'absolute',
'top': initialBarPosition
});
};
return $bar;
};
$.revealbar.destroy = function() {
if (destroyRevealBar) return destroyRevealBar();
};
$.fn.revealbar = function(options) {
return $.revealbar(this, options);
};
})(jQuery);