Getting started with jQuery idiots

This article is too idiotic for you. If HTML and CSS are not, you may not understand the following content. (It is better to have a little bit of English, or it will be very troublesome)

What is jQuery?
JQuery is a JavaScript library, and an idiot's explanation is a JavaScript toolbox. There are many ready-made tools that can be used for whatever you want. Saving the trouble of re-writing code, it is easier to get started with JavaScript idiots like me.

What can jQuery do?
It can make your page have a lot of amazing dynamic effects. Simply put, it is to make your website more beautiful. There are many different effects here. Click here to view >>>

How to Use jQuery?
Simply put: by calling the jQuery Library (a js file) on the page, you can easily use the tool (another js is required to call the tool in jQuery ), to achieve the desired effect.

Step 1: Find the desired effect
The effects of this site come from two aspects: sonicHTML and jQuery tools. There are more results on the network. If you are willing to spend time, you can look elsewhere.

Step 2: code extraction
First, we recommend Firefox + firebug, a powerful code tool. If not, hurry up! Be very careful with the code!

1. html and css in static pages

Use firebug to obtain the HTML and CSS code you want on the page. Do not change the id and class of this part!

At the same time, there may be an empty <div> Effect> before the HTML element you want. Do not omit it!

2. js in

(1) In the called js, there will certainly be a js file name with "jQuery", directly copying the code of this file into your own file.

(2) there must be another js in

$ (Document). ready (function (){

// Other code is in the middle

});
This js may be an external file called, or it may appear in the header (body, but it is less likely) in the form of <script> </script>. In this part, the id or class in the HTML is displayed. Be sure to keep them consistent. If you want to use other names, you must remember to synchronize them in HTML and js. If they are different, you will lose money.

Step 3: test locally and modify errors
Create HTML, CSS, and JS locally and put all the code obtained. All the called files are called. The exciting time has come! Open a static page in a browser to check whether the page works. If this happens, congratulations! Go to the next step and transform it into your own things! If not, check carefully:

(1) Possible Errors in HTML:

① You modified the id or class in HTML [solution: change back to the original]

② Empty <div> [solution: Check the HTML you pulled and see if there is any blank <div>. If yes, add it]

(2) Possible Errors in JS:

① Call path error [solution: change to a valid call path and put js and HTML together for the most convenient operation]

② This js (which may be an external file or the code in the head) is missing (solution: Find the Code with ready on the original static page, copy and add]

③ The id or class in ready is inconsistent with that in HTML. [solution: Find the corresponding link in the original HTML and js and change it to the same]

Step 4: Modify HTML and css to become your own things
There is no fixed method in this step. You can modify the method if you want to modify it. But pay attention to the id and class in HTML to correspond to js!

Step 5: add to your own page
This is basically nothing to say, but I still want to say to the wp users: external file calls are all in the header in the topic folder. php (I have been searching for it for half a day ~~~~)
Appendix:

1. Complete tutorials on the official jQuery website (for details, please read them carefully) >>>

2. Getting Started manual in jQuery tools (short and concise, and strongly recommended for Quick Start) >>>

3. sonicHTML (blogs subscribed to in greader often have cases and Demos, which are very practical) >>>