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