WordPress uses jquery to implement a dynamic drop-down menu

First, you need to create a menu for your site, which can be achieved through the WordPress management background-appearance-menu bar. To display the created menu on the page, you need to perform the following steps:

Open the FUNCTION. Php file of your topic and add the following code to it,

The code is as follows:	Copy code
Register_nav_menus (); Wp_nav_menu (array ('menu '= & gt; 'mymenu', 'dest' = & gt; 1 ));

Use the register_nav_menus () function to register a menu. It also supports registration of multiple menus.

Then you can display menus on the page, such as HTML

WORDPRESS
It allocates the corresponding class to the LI in the menu. It is not difficult to find that the current page is allocated with. current-menu-item. The current article is classified as. current-post-ancestor ..
So we can add the CSS style you want to these classes directly. It's very easy ..

The code is as follows:	Copy code
. Current-post-ancestor a,. current-menu-parent a,. current-menu-item a,. current_page_item { Color: green; }

This is OK. For the effect, see the menu of this website. It seems like nonsense...

Level 2 drop-down menu

The second-level menu section of the original css display is as follows:

The code is as follows:	Copy code
# Access ul li: hover> ul {display: block ;}

Even because the jQuery library has been added to the blog, it is easy to implement the dynamic drop-down menu effect and add the code:

The code is as follows:	Copy code
JQuery (document). ready (function ($ ){ $ ('# Access ul li'). hover (function (){ $ ('Ul ', this). slideDown (300) }, Function (){ $ ('Ul ', this). slideUp (300) }) });

The second-level menu after Jquery can be dynamically displayed in ie6, ie7, ie8, and firefox