-
Notifications
You must be signed in to change notification settings - Fork 0
/
jSlidingPanels.js
69 lines (59 loc) · 1.84 KB
/
jSlidingPanels.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
(function( $ ) {
var openDelay = 100;
var closeDelay = 300;
$.fn.jSlidingPanel = function(edge, exposedPx, initialDelay, handleElement) {
console.log('jSlidingPanel', edge, exposedPx, initialDelay, handleElement);
var panelOpen = true;
var closeTimeout = false;
var openTimeout = false;
var size;
if (edge === 'top' || edge === 'bottom') {
size = this.height();
} else if (edge === 'left' || edge === 'right') {
size = this.width();
} else {
throw "edge must be 'top', 'bottom', 'left' or 'right'.";
}
console.log('size', size);
var property = 'margin-' + edge;
var that = this;
function close() {
console.log('close');
if (!panelOpen) return;
if (handleElement) handleElement.show();
var animOb = {};
animOb[property] = (exposedPx - size) + 'px';
console.log('that.animate(animOb)', animOb);
that.animate(animOb);
panelOpen = false;
closeTimeout = false;
};
function open() {
console.log('open');
if (panelOpen) return;
if (handleElement) handleElement.hide();
var animOb = {};
animOb[property] = '0px';
console.log('that.animate(animOb)', animOb);
that.animate(animOb);
panelOpen = true;
};
this.mouseleave(function() {
console.log('mouseleave');
if (closeTimeout) clearTimeout(closeTimeout);
if (openTimeout) clearTimeout(openTimeout);
closeTimeout = setTimeout(close, closeDelay);
});
this.mouseenter(function() {
console.log('mouseenter');
if (openTimeout) clearTimeout(openTimeout);
if (closeTimeout) clearTimeout(closeTimeout);
closeTimeout = setTimeout(open, openDelay);
});
if (initialDelay) {
closeTimeout = setTimeout(close, initialDelay);
} else {
close();
}
};
})( jQuery );