So I am using Jquery to display a pop up menu on my current site. The html is a wordpress wp_list_pages output for all you wordpress types out there. For all you non-wordpress types, this means that wordpress will output nested ul & li elements in accordance with page architecture on wordpress. Bottom line, I want the jquery code to be wordpress compatible, so if I change the pages, the code will handle this.
I want the code to be lite but the following is a bit janky. Any better ideas? Plus I want the pop up menu only to appear after the mouse has hovered over the ul element for 1000ms (1s), but not otherwise. Thoughts?
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');
}
);
});