So it's kind of a fun one morning go through really modifying the copy with existing CSSA class.
So what I've done so far is just kept our same basic who'd been through the other videos I've seen basically
just a couple of paragraphs here so they can see things being targeted within an idea of container.
But I did do this time as an added form buttons or just text links up here.
We're going to add a class.
We will remove a class will toggle a class which will be turning on and off just by using the one button
as opposed to having to use two.
We're also going to increase a class so you can see what those are but I'm into all that through CSSA
and through the javascript or the query Javascript.
So I do have is up here is my style and I'm going to target it through something called color box and
shows me the colors on the short and simple and I don't screw up any typing here.
So style accreted of color you can pick whatever color you want and that should change the color and
appear.
I've got my J.A.G. link and within here I've got the javascript or the G20 script that we're going to
start writing and we're going to start with the very first one that we have down here at class.
In fact I will go ahead and copy that and we will do is we start with everyday grade and start with
the dollar sign.
If I open and close friends of my close quotes and we say hash tag and class the first one that we do
is for Target that button with an event and that event is going to be a click.
So one click create a function and that function will open and close with Prince and curly brackets
right there and go I can close it out.
But don't forget that.
So what's going to happen when somebody clicks on the ADD class we are going to using the dollar sign
and say and change the substance go ahead and quotes there the paragraph tag.
And we're going to start with the first pair.
So again not familiar with this still I question and I go back and watch some of the other videos where
we're Do the field training or just brush up on your CSSA and said the same thing.
We're a target just the first paragraph here and we're going to do is we're going to have a function
called add class.
So I know that's kind of the name but I named this right here.
That's not the same.
This is an actual jaggery function.
You can add a class C Ss class and we can do is we can pick from all of our different classes.
Now most web pages are going to have hundreds and hundreds of different classes all set up in their
document.
So you need to make sure that you are targeting the correct one.
What we'll do is open it close up friends but some are saying to use single quotes and we will say color.
So we are targeting that color class and class there and hit that close that out and what we can do
is we can now go ahead and just copy and paste its little function that we created right here and I'm
going to say remove class.
OK.
So now we're starting to remove class and we should get this bill written and removed dash class a lower
case from a second button remove class.
So again it will be another click function or a click event.
The function will be here.
Brianna targer that first paragraph again.
So you can actually see that class being removed from here.
And instead of and class will say move class.
So very similar to our button.
Here again are I.D. for the button and we will say still going to remove this color class.
So maybe within this maybe there is one class that was a color that had just a color to it and you want
to remove the class where you can actually target a different one that was removing the color and changing
the font size or something like that.
So you could target different CSSA classes here to keep this simple and just target the same one.
And I'm going to paste again this first one that I had here.
We're in target the third button of Tuggle class to change that to type of class.
There is no click function as you are still going to target that first paragraph again.
And you can guess it's going to be low class the other function as part of Jake where we are right here
where we can target target toggle on him.
These are style that we've created here.
Again we only have the one so we're going to keep targeting this one for right now.
That's what we want to do is we are going to do the in crease size.
What do they call that one increase class something say target the increase class here this will be
another quick function and we're a target that first paragraph again.
And instead of targeting the style that we've done down here I just want to target C S S.
This is kind of a cool one little bit different than anything I've shown in the previous videos here
although very similar.
We will say within the parentheses there and open up a set of quotes and we will say font size.
And remember we keep them the quotes there that is the value that we are.
Excuse me that is the the file.
Is what retired in through CSSA right there is the word font size.
And we do a comma while open up another set of quotes right there.
And what we will do is you add.
This is kind of a little bit of programming right here.
There is a plus.
Equals one pixel.
So it's going to add one pixel.
Every time I click on it.
So I can keep on increasing the size of this and I can also create a decrease class option and where
said minus equals one pixel so it'll decrease the size of the font.
So somebody could maybe increase or decrease the size of the font on the Web site.
Be very very helpful.
Definitely something I've seen in the past could get you x.
Right.
So it's going save this hope I don't have any errors in that seeing thing going up in here right now
and I need to be saving this one as it's constancy.
SS modify I'll save that my J.A.G. document and go and come back and find CSSA modified.
All right so you got the three paragraphs long the first one should be targeted here.
So I say add class size and that blue color to my first paragraph removed should get rid of it.
So go back to the black so I'm no longer applying that class to this document toggle class salaamed
to term black blue black blue black blue just by clicking on the one button here and increase Salame
to keep on clicking and increasing the size of it.
I've read things you can do by targeting these CSSA classes by using ed class remove class and toggle
class.
All three are J.A.G. document.