Hello,
Today about jQuery
I would like to share the basic knowledge I have learned.
First of all
If you don't know a simple formula
It doesn't start, so let's learn from the official.
$ ('HTML element').Method (argument);
is.
Short!
I think some people thought,
I will add various things from here.
Of course, this doesn't end there.
Brief commentary
HTML element
For example,
index.html
<h1 >Hello<h1>
It is h1 to say in the place
Also, don't forget to add the last; (semicolon).
This is the basic syntax.
Now let's talk about what you can do with jQuery using this formula.
Can be animated
When I first saw it, I thought it was amazing!
Is it possible to make such a change by adding just two lines of jQuery description?
I was impressed and stared at the screen for a while like a child.
How to write,
$ ('HTML element').fadeOut (specify the speed at which the animation occurs);
is.
This will remove the html element at the specified location!
$ ('HTML element').fadeIn (specify the speed at which the animation occurs);
Will appear when
Brief commentary
When specifying the speed, please be aware that 1000 is 1 second
For fadeOut, slideUp is okay.
If you can change the color of the designated destination without permission, ...
This is also very easy to make
This is official.
$ ('HTML element').css（'Property(color)' , 'Value (blue or something)'）;
You can change the color of the HTML element specified in this.
It's fun is not it.
Using the click event, "Ah, I often see this." Can make a movement
Next to a simple animation
I increased the amount of description a little and used the click event,
"Ah, this is the one I often see."
Let's make something like
The formula looks like this.
$ ('HTML element').Event name (function)(){
Event content
}）;
I would like to use "click" for this event name.
$ ('HTML element 1').click（function(){
$ ('HTML element 2').slideUp
}）;
By doing this,
When you click HTML element 1
HTML element 2 disappears.
It is wonderful. ..
jQuery is amazing ...
This is the end of the brief explanation
Let's meet again.
Recommended Posts