Jake where are you chaining allows us to run multiple Jake where he commands one after the other on
the same element.
Let's take a look at an example on this page.
We have a div element the blue square when we click the enemy button.
The square slides up within a timeframe of two seconds.
And it also changes the color to red once that sequence is completed.
The square slides down within the same time frame slides up and slides down so a single event the click
of the enemy button triggers a color change in two actions.
Slide up and slide down which run one after the other on the same element.
So let's take a look at how this works.
In our body take we have two elements.
One div with the I.D. square in our animate button.
This will trigger the animation as we saw in the demonstration.
We have a style sheet that defines what the square looks like a blue background to start with.
Within height of one hundred and sixty pixels a small margin at the top and absolute position
our script starts with a click even on the button when the button is clicked a CSX change event is applied
to the element with the ideas squared.
So our blue square
turns into red and so we've specified the background properties where we want to change and we want
to change it to red when the button is clicked.
In addition to this SS change we also have two actions
first the element will slide up at a speed of two seconds and after that the element will slide down
with the same speed.
This is known as chaining.
We are chaining two actions together on the same element.
Square and so that's how that works.