Animación del menú de navegación de JQuery con la lista de páginas de Wordpress
Pregunta
Así que estoy usando Jquery para mostrar un menú emergente en mi sitio actual. El html es una salida de wordpress wp_list_pages para todos los tipos de wordpress que existen. Para todos los tipos que no son de wordpress, esto significa que wordpress generará ul & amp; Elementos li de acuerdo con la arquitectura de la página en WordPress. En pocas palabras, quiero que el código jquery sea compatible con WordPress, así que si cambio las páginas, el código se encargará de esto.
Quiero que el código sea lite pero lo siguiente es un poco extraño. ¿Alguna idea mejor? Además, quiero que el menú emergente solo aparezca después de que el mouse haya estado sobre el elemento ul durante 1000 ms (1 s), pero no de otra manera. Pensamientos?
jQuery(document).ready(function() {
jQuery.fn.pauseit = function(duration) {
jQuery(this).animate({ dummy: 1 }, duration);
return this;
};
});
jQuery(document).ready(function() {
jQuery("div#access li.page_item ul").css({display: "none"}); // Opera Fix
jQuery("div#access li.page_item").hover(
function(){
jQuery(this).find('ul:first').pauseit(1000).css({/*visibility: "visible",display: "none"*/}).fadeIn('fast');
},
function(){
jQuery(this).find('ul:first').css({/*visibility: "hidden",*/}).fadeOut('fast');
}
);
});
Solución
Entonces descubrí hoverIntent en http://cherne.net/brian/resources/ jquery.hoverIntent.html . Esto resolvió mi problema.