root / tei / js / jquery.jdMenu.js @ 2
Historique | Voir | Annoter | Télécharger (4,48 ko)
1 | 2 | mingarao | /*
|
---|---|---|---|
2 | 2 | mingarao | * jdMenu 1.4.1 (2008-03-31)
|
3 | 2 | mingarao | *
|
4 | 2 | mingarao | * Copyright (c) 2006,2007 Jonathan Sharp (http://jdsharp.us)
|
5 | 2 | mingarao | * Dual licensed under the MIT (MIT-LICENSE.txt)
|
6 | 2 | mingarao | * and GPL (GPL-LICENSE.txt) licenses.
|
7 | 2 | mingarao | *
|
8 | 2 | mingarao | * http://jdsharp.us/
|
9 | 2 | mingarao | *
|
10 | 2 | mingarao | * Built upon jQuery 1.2.1 (http://jquery.com)
|
11 | 2 | mingarao | * This also requires the jQuery dimensions >= 1.2 plugin
|
12 | 2 | mingarao | */
|
13 | 2 | mingarao | |
14 | 2 | mingarao | // This initializes the menu
|
15 | 2 | mingarao | $(function() { |
16 | 2 | mingarao | $('ul.jd_menu').jdMenu(); |
17 | 2 | mingarao | }); |
18 | 2 | mingarao | |
19 | 2 | mingarao | (function($){ |
20 | 2 | mingarao | function addEvents(ul) { |
21 | 2 | mingarao | var settings = $.data( $(ul).parents().andSelf().filter('ul.jd_menu')[0], 'jdMenuSettings' ); |
22 | 2 | mingarao | $('> li', ul) |
23 | 2 | mingarao | .bind('mouseenter.jdmenu mouseleave.jdmenu', function(evt) { |
24 | 2 | mingarao | $(this).toggleClass('jdm_hover'); |
25 | 2 | mingarao | var ul = $('> ul', this); |
26 | 2 | mingarao | if ( ul.length == 1 ) { |
27 | 2 | mingarao | clearTimeout( this.$jdTimer ); |
28 | 2 | mingarao | var enter = ( evt.type == 'mouseenter' ); |
29 | 2 | mingarao | var fn = ( enter ? showMenu : hideMenu );
|
30 | 2 | mingarao | this.$jdTimer = setTimeout(function() { |
31 | 2 | mingarao | fn( ul[0], settings.onAnimate, settings.isVertical );
|
32 | 2 | mingarao | }, enter ? settings.showDelay : settings.hideDelay ); |
33 | 2 | mingarao | } |
34 | 2 | mingarao | }) |
35 | 2 | mingarao | .bind('click.jdmenu', function(evt) { |
36 | 2 | mingarao | var ul = $('> ul', this); |
37 | 2 | mingarao | if ( ul.length == 1 && |
38 | 2 | mingarao | ( settings.disableLinks == true || $(this).hasClass('accessible') ) ) { |
39 | 2 | mingarao | showMenu( ul, settings.onAnimate, settings.isVertical ); |
40 | 2 | mingarao | return false; |
41 | 2 | mingarao | } |
42 | 2 | mingarao | |
43 | 2 | mingarao | // The user clicked the li and we need to trigger a click for the a
|
44 | 2 | mingarao | if ( evt.target == this ) { |
45 | 2 | mingarao | var link = $('> a', evt.target).not('.accessible'); |
46 | 2 | mingarao | if ( link.length > 0 ) { |
47 | 2 | mingarao | var a = link[0]; |
48 | 2 | mingarao | if ( !a.onclick ) {
|
49 | 2 | mingarao | window.open( a.href, a.target || '_self' );
|
50 | 2 | mingarao | } else {
|
51 | 2 | mingarao | $(a).trigger('click'); |
52 | 2 | mingarao | } |
53 | 2 | mingarao | } |
54 | 2 | mingarao | } |
55 | 2 | mingarao | if ( settings.disableLinks ||
|
56 | 2 | mingarao | ( !settings.disableLinks && !$(this).parent().hasClass('jd_menu') ) ) { |
57 | 2 | mingarao | $(this).parent().jdMenuHide(); |
58 | 2 | mingarao | evt.stopPropagation(); |
59 | 2 | mingarao | } |
60 | 2 | mingarao | }) |
61 | 2 | mingarao | .find('> a')
|
62 | 2 | mingarao | .bind('focus.jdmenu blur.jdmenu', function(evt) { |
63 | 2 | mingarao | var p = $(this).parents('li:eq(0)'); |
64 | 2 | mingarao | if ( evt.type == 'focus' ) { |
65 | 2 | mingarao | p.addClass('jdm_hover');
|
66 | 2 | mingarao | } else {
|
67 | 2 | mingarao | p.removeClass('jdm_hover');
|
68 | 2 | mingarao | } |
69 | 2 | mingarao | }) |
70 | 2 | mingarao | .filter('.accessible')
|
71 | 2 | mingarao | .bind('click.jdmenu', function(evt) { |
72 | 2 | mingarao | evt.preventDefault(); |
73 | 2 | mingarao | }); |
74 | 2 | mingarao | } |
75 | 2 | mingarao | |
76 | 2 | mingarao | function showMenu(ul, animate, vertical) { |
77 | 2 | mingarao | var ul = $(ul); |
78 | 2 | mingarao | if ( ul.is(':visible') ) { |
79 | 2 | mingarao | return;
|
80 | 2 | mingarao | } |
81 | 2 | mingarao | ul.bgiframe(); |
82 | 2 | mingarao | var li = ul.parent();
|
83 | 2 | mingarao | ul .trigger('jdMenuShow')
|
84 | 2 | mingarao | .positionBy({ target: li[0], |
85 | 2 | mingarao | targetPos: ( vertical === true || !li.parent().hasClass('jd_menu') ? 1 : 3 ), |
86 | 2 | mingarao | elementPos: 0, |
87 | 2 | mingarao | hideAfterPosition: true |
88 | 2 | mingarao | }); |
89 | 2 | mingarao | if ( !ul.hasClass('jdm_events') ) { |
90 | 2 | mingarao | ul.addClass('jdm_events');
|
91 | 2 | mingarao | addEvents(ul); |
92 | 2 | mingarao | } |
93 | 2 | mingarao | li .addClass('jdm_active')
|
94 | 2 | mingarao | // Hide any adjacent menus
|
95 | 2 | mingarao | .siblings('li').find('> ul:eq(0):visible') |
96 | 2 | mingarao | .each(function(){
|
97 | 2 | mingarao | hideMenu( this );
|
98 | 2 | mingarao | }); |
99 | 2 | mingarao | if ( animate === undefined ) { |
100 | 2 | mingarao | ul.show(); |
101 | 2 | mingarao | } else {
|
102 | 2 | mingarao | animate.apply( ul[0], [true] ); |
103 | 2 | mingarao | } |
104 | 2 | mingarao | } |
105 | 2 | mingarao | |
106 | 2 | mingarao | function hideMenu(ul, animate) { |
107 | 2 | mingarao | var ul = $(ul); |
108 | 2 | mingarao | $('.bgiframe', ul).remove(); |
109 | 2 | mingarao | ul .filter(':not(.jd_menu)')
|
110 | 2 | mingarao | .find('> li > ul:eq(0):visible')
|
111 | 2 | mingarao | .each(function() {
|
112 | 2 | mingarao | hideMenu( this );
|
113 | 2 | mingarao | }) |
114 | 2 | mingarao | .end(); |
115 | 2 | mingarao | if ( animate === undefined ) { |
116 | 2 | mingarao | ul.hide() |
117 | 2 | mingarao | } else {
|
118 | 2 | mingarao | animate.apply( ul[0], [false] ); |
119 | 2 | mingarao | } |
120 | 2 | mingarao | |
121 | 2 | mingarao | ul .trigger('jdMenuHide')
|
122 | 2 | mingarao | .parents('li:eq(0)')
|
123 | 2 | mingarao | .removeClass('jdm_active jdm_hover')
|
124 | 2 | mingarao | .end() |
125 | 2 | mingarao | .find('> li')
|
126 | 2 | mingarao | .removeClass('jdm_active jdm_hover');
|
127 | 2 | mingarao | } |
128 | 2 | mingarao | |
129 | 2 | mingarao | // Public methods
|
130 | 2 | mingarao | $.fn.jdMenu = function(settings) { |
131 | 2 | mingarao | // Future settings: activateDelay
|
132 | 2 | mingarao | var settings = $.extend({ // Time in ms before menu shows |
133 | 2 | mingarao | showDelay: 200, |
134 | 2 | mingarao | // Time in ms before menu hides
|
135 | 2 | mingarao | hideDelay: 500, |
136 | 2 | mingarao | // Should items that contain submenus not
|
137 | 2 | mingarao | // respond to clicks
|
138 | 2 | mingarao | disableLinks: true |
139 | 2 | mingarao | // This callback allows for you to animate menus
|
140 | 2 | mingarao | //onAnimate: null
|
141 | 2 | mingarao | }, settings); |
142 | 2 | mingarao | if ( !$.isFunction( settings.onAnimate ) ) { |
143 | 2 | mingarao | settings.onAnimate = undefined;
|
144 | 2 | mingarao | } |
145 | 2 | mingarao | return this.filter('ul.jd_menu').each(function() { |
146 | 2 | mingarao | $.data( this, |
147 | 2 | mingarao | 'jdMenuSettings',
|
148 | 2 | mingarao | $.extend({ isVertical: $(this).hasClass('jd_menu_vertical') }, settings) |
149 | 2 | mingarao | ); |
150 | 2 | mingarao | addEvents(this);
|
151 | 2 | mingarao | }); |
152 | 2 | mingarao | }; |
153 | 2 | mingarao | |
154 | 2 | mingarao | $.fn.jdMenuUnbind = function() { |
155 | 2 | mingarao | $('ul.jdm_events', this) |
156 | 2 | mingarao | .unbind('.jdmenu')
|
157 | 2 | mingarao | .find('> a').unbind('.jdmenu'); |
158 | 2 | mingarao | }; |
159 | 2 | mingarao | $.fn.jdMenuHide = function() { |
160 | 2 | mingarao | return this.filter('ul').each(function(){ |
161 | 2 | mingarao | hideMenu( this );
|
162 | 2 | mingarao | }); |
163 | 2 | mingarao | }; |
164 | 2 | mingarao | |
165 | 2 | mingarao | // Private methods and logic
|
166 | 2 | mingarao | $(window)
|
167 | 2 | mingarao | // Bind a click event to hide all visible menus when the document is clicked
|
168 | 2 | mingarao | .bind('click.jdmenu', function(){ |
169 | 2 | mingarao | $('ul.jd_menu ul:visible').jdMenuHide(); |
170 | 2 | mingarao | }); |
171 | 2 | mingarao | })(jQuery); |