report du js ameliore avec tempo a l'ouverture sur les menu deroulant (e81bcb1f) · Validations · eldk / spip

prive/javascript/gadgets.js

+42 −15

Numéro de ligne d'origine	Numéro de ligne de diff	Ligne de diff
		@@ -5,7 +5,9 @@ function init_gadgets(url_toutsite,url_navrapide,url_agenda,html_messagerie){
		url: url_toutsite,
		success: function(c){
		jQuery('#boutonbandeautoutsite').siblings('ul').remove();
		jQuery('#boutonbandeautoutsite').after(c);
		jQuery('#boutonbandeautoutsite')
		.after(c)
		.parent().find('li').menuFocus();
		}
		});
		});
		@@ -15,6 +17,21 @@ function focus_zone(selecteur){
		return false;
		}
		jQuery(document).ready(function(){
		var is_open = 0;
		jQuery.fn.menuItemOpen = function(){
		jQuery(this)
		.addClass('actif')
		.parents('li').addClass('actif');
		jQuery(this).siblings('li').removeClass('actif_tempo');
		is_open = true;
		return this;
		}
		jQuery.fn.menuItemClose = function(){
		jQuery(this)
		.removeClass('actif_tempo');
		is_open = (jQuery(this).parents('ul').eq(-1).find('li.actif').length>0);
		return this;
		}
		// deplier le menu au focus clavier,
		// enlever ce depliement si passage a la souris,
		// delai de fermeture.
		@@ -22,24 +39,34 @@ jQuery(document).ready(function(){
		jQuery(this)
		// le replier si un hover de souris sur un autre onglet,
		// timer sur la fermeture des onglets pour ne pas que ca aille trop vite
		// timer sur l'ouverture des onglets pour ne tolerer les derapages
		.hover(
		function(){
		if (this.timer)
		clearTimeout(this.timer);
		this.timer = null;
		/jQuery(this).parents('ul').find('>li.actif').removeClass('actif');/
		jQuery(this)
		.addClass('actif')
		.parents('li').addClass('actif');
		jQuery(this).siblings('li').removeClass('actif_tempo');
		if (this.timerout)
		clearTimeout(this.timerout);
		this.timerout = null;
		this.timerin = null;
		if (is_open)
		jQuery(this).menuItemOpen();
		else {
		var me = jQuery(this);
		this.timerin= setTimeout(function(){
		me.menuItemOpen(null);
		}, 200);
		}
		}
		,
		function(){
		if (this.timerin)
		clearTimeout(this.timerin);
		this.timerin = null;
		if (is_open){
		var me = jQuery(this).removeClass('actif').addClass('actif_tempo');
		this.timer = setTimeout(function(){
		me.removeClass('actif_tempo');
		this.timerout = setTimeout(function(){
		me.menuItemClose();
		}, 400);
		}
		}
		)
		// navigation au clavier :
		// deplier le ul enfant

prive/style_prive.html

+4 −4

Numéro de ligne d'origine	Numéro de ligne de diff	Ligne de diff
		@@ -134,9 +134,9 @@ td { text-align: #GET{left}; }

		#bando_haut ul.deroulant li { /position:relative; /float:#GET{left}; display: block; }
		#bando_haut ul.deroulant li ul li {float:none;position:static;}
		#bando_haut ul.deroulant li:hover, #bando_haut ul.deroulant li.actif,#bando_haut ul.deroulant li.actif_tempo { background-color: #[(#GET{claire}\|couleur_eclaircir\|couleur_eclaircir)]; }
		#bando_haut ul.deroulant li.actif,#bando_haut ul.deroulant li.actif_tempo { background-color: #[(#GET{claire}\|couleur_eclaircir\|couleur_eclaircir)]; }
		#bando_haut ul.deroulant li ul {border: 1px solid #aaaaaa; border-top: 0; text-align:#GET{left}; height: auto; width: auto; display: block; position:absolute; #GET{left}:-3000em; z-index: 99; }
		#bando_haut ul.deroulant li:hover ul, #bando_haut ul.deroulant li.actif ul, #bando_haut ul.deroulant li.actif_tempo ul { #GET{left}:auto;}
		#bando_haut ul.deroulant li.actif ul, #bando_haut ul.deroulant li.actif_tempo ul { #GET{left}:auto;}
		#bando_haut ul.deroulant li a { display: block; color:#444; font-weight:bold;}
		#bando_haut ul.deroulant li ul li { background-color: #fff; }
		#bando_haut ul.deroulant li ul li a { }
		@@ -172,8 +172,8 @@ td { text-align: #GET{left}; }
		#bando_outils ul.deroulant li.toutsite {background-image:none;}

		#bando_outils ul.deroulant li ul li {float:none;position:relative;}
		#bando_outils ul.deroulant li:hover li ul, #bando_outils ul.deroulant li.actif li ul, #bando_outils ul.deroulant li.actif_tempo li ul { #GET{left}:-3000em;}
		#bando_outils ul.deroulant li li:hover >ul,#bando_outils ul.deroulant li li.actif >ul,#bando_outils ul.deroulant li li.actif_tempo >ul {#GET{left}:50px;top:1.5em;}
		#bando_outils ul.deroulant li.actif li ul, #bando_outils ul.deroulant li.actif_tempo li ul { #GET{left}:-3000em;}
		#bando_outils ul.deroulant li li.actif >ul,#bando_outils ul.deroulant li li.actif_tempo >ul {#GET{left}:50px;top:1.5em;}

		#bando_outils ul.deroulant li ul {width:770px;}
		.large #bando_outils ul.deroulant li ul {width:970px;}