Site icon Css3 Transition

Change Font Size On Button Click using Javascript

Change Font Size On Button Click

With this post I am going to share with you guys how to change element or para font-size using javascript code with a very smooth css3 transition effect.

In this effect there are two case for font-size change

1: by click button “click to change font-size”

2: by Click buton “click to google font-size”

For frist case I am adding a css for font-size using java script to increase the font=size by javascript. This will change to font-size only once for the frist click you can not revert back to previous font size without refreshing page.

For second case you will able to change the background color again color again n again

Java script code for first scripting :-

 

By adding and removing add using toggle function in javascript.

For second case I am java script to toggle a class on button click so that a class will get added and remove on button click

Javascript code for second button click :-

 

HTml code :-

Css code :-

Exit mobile version