Implement accordion expansion and folding navigation menu based on jquery _jquery

This section shares a code example that implements the accordion approach to expand and collapse the navigation menu effect.

The code example is as follows:

The code example is as follows: <! DOCTYPE html>  

The code above implements our requirements, the following is an introduction to its implementation process.

A. Code comments:

(1). $ (document). Ready (function () {}) to execute code in the function when the document structure is completely loaded.
(2). $ ("Dd:not (: First)"). Hide (), except for all DD elements that are outside the first DD element, the submenu of the first navigation menu is expanded and the other is hidden.
(3). $ ("dt a"). Click (function () {}) to register the click event handler for a element under the DT element.
(4). $ ("dd:visible"). Slideup ("slow"), all the DD elements that have been displayed are animated to shrink hidden.
(5). $ (This). Parent (). Next (). Slidedown ("slow"), the parent element of the current connection a element is the DT element, the next element of the DT element is the level two menu DD element, and the menu is animated.
(6). Return False, this is important to prevent the link to jump action.

The above is a small set for everyone to share based on jquery implementation of the accordion to expand and fold the navigation menu, I hope to help you.