JQuery-based simple list navigation menu _ jquery-js tutorial

Recently, I started to learn about JQUERY. I feel that JQUERY has very powerful functions and the amount of code has been reduced a lot... the code is also very clear! The following is a simple navigation menu that I made. As a newbie, there is something wrong with it!

Now let's get started:

1. First define the CSS style sheet:

The Code is as follows:

2. Reference JQUERY framework, you can go to the official online download the latest JQUERY, as if the JQUERY1.5 version has been released, link address: http://jquery.com/

3. Define HTML tags:

The Code is as follows:

• 
  

  
  
  Computer Digital Products
  

  
  
  
  
  • Notebook
  
  
  
  
  • Notebook 1
  
  
  • Notebook 2
  
  
  • Notebook 3
  
  
  • Notebook 4
  
  
  • Notebook 5
  
  
  
  
  • Mobile hard drive
  
  
  
  
  • Mobile hard drive 1
  
  
  • Mobile hard drive 2
  
  
  • Mobile hard drive 3
  
  
  • Mobile hard drive 4
  
  
  • Mobile hard drive 5
  
  
  
  
  • Computer Software
  
  
  
  
  • Computer Software 1
  
  
  • Computer Software 2
  
  
  • Computer software 3
  
  
  • Computer software 4
  
  
  • Computer software 5
  
  
  
  
  • Digital Products
  
  
  
  
  • Digital Product 1
  
  
  • Digital Product 2
  
  
  • Digital Product 3
  
  
  • Digital Product 4
  
  
  • Digital product 5
  
  
  
  
  
  
  

4. Next we will define the most important JQUERY code:

The Code is as follows: