forked from soundasleep/jquery-dropdown
-
Notifications
You must be signed in to change notification settings - Fork 0
/
jquery.dropdown.js
130 lines (106 loc) · 3.52 KB
/
jquery.dropdown.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
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
/*
* jQuery dropdown: A simple dropdown plugin
*
* Inspired by Bootstrap: http://twitter.github.com/bootstrap/javascript.html#dropdowns
*
* Copyright 2013 Cory LaViska for A Beautiful Site, LLC. (http://abeautifulsite.net/)
*
* Dual licensed under the MIT / GPL Version 2 licenses
*
*/
if(jQuery) (function($) {
$.extend($.fn, {
dropdown: function(method, data) {
switch( method ) {
case 'hide':
hide();
return $(this);
case 'attach':
return $(this).attr('data-dropdown', data);
case 'detach':
hide();
return $(this).removeAttr('data-dropdown');
case 'disable':
return $(this).addClass('dropdown-disabled');
case 'enable':
hide();
return $(this).removeClass('dropdown-disabled');
}
}
});
function show(event) {
var trigger = $(this),
dropdown = $(trigger.attr('data-dropdown')),
isOpen = trigger.hasClass('dropdown-open');
// In some cases we don't want to show it
if( $(event.target).hasClass('dropdown-ignore') ) return;
event.preventDefault();
event.stopPropagation();
hide();
if( isOpen || trigger.hasClass('dropdown-disabled') ) return;
// Show it
trigger.addClass('dropdown-open');
dropdown
.data('dropdown-trigger', trigger)
.show();
// Position it
position();
// Trigger the show callback
dropdown
.trigger('show', {
dropdown: dropdown,
trigger: trigger
});
}
function hide(event) {
// In some cases we don't hide them
var targetGroup = event ? $(event.target).parents().addBack() : null;
// Are we clicking anywhere in a dropdown?
if( targetGroup && targetGroup.is('.dropdown') ) {
// Is it a dropdown menu?
if( targetGroup.is('.dropdown-menu') ) {
// Did we click on an option? If so close it.
if( !targetGroup.is('A') ) return;
} else {
// Nope, it's a panel. Leave it open.
return;
}
}
// Hide any dropdown that may be showing
$(document).find('.dropdown:visible').each( function() {
var dropdown = $(this);
dropdown
.hide()
.removeData('dropdown-trigger')
.trigger('hide', { dropdown: dropdown });
});
// Remove all dropdown-open classes
$(document).find('.dropdown-open').removeClass('dropdown-open');
}
function position() {
var dropdown = $('.dropdown:visible').eq(0),
trigger = dropdown.data('dropdown-trigger'),
hOffset = trigger ? parseInt(trigger.attr('data-horizontal-offset') || 0, 10) : null,
vOffset = trigger ? parseInt(trigger.attr('data-vertical-offset') || 0, 10) : null;
if( dropdown.length === 0 || !trigger ) return;
// Position the dropdown relative-to-parent...
if( dropdown.hasClass('dropdown-relative') ) {
dropdown.css({
left: dropdown.hasClass('dropdown-anchor-right') ?
trigger.position().left - (dropdown.outerWidth(true) - trigger.outerWidth(true)) - parseInt(trigger.css('margin-right')) + hOffset :
trigger.position().left + parseInt(trigger.css('margin-left')) + hOffset,
top: trigger.position().top + trigger.outerHeight(true) - parseInt(trigger.css('margin-top')) + vOffset
});
} else {
// ...or relative to document
dropdown.css({
left: dropdown.hasClass('dropdown-anchor-right') ?
trigger.offset().left - (dropdown.outerWidth() - trigger.outerWidth()) + hOffset : trigger.offset().left + hOffset,
top: trigger.offset().top + trigger.outerHeight() + vOffset
});
}
}
$(document).on('click.dropdown', '[data-dropdown]', show);
$(document).on('click.dropdown', hide);
$(window).on('resize', position);
})(jQuery);