Full Control With Animate


In previous lessons we learn about how to change or modify animation methods as fadeIn, slideUp etc. So in this lesson we learn how to modify elements width, height or font-size etc. In below example we are going to increase font-size of #box p and change the color of fonts. Let see

Image

In the above example we create a var for font-size and convert it into integer value by using parseInt function and than give increment into 5 px every time when we click on button. But jQuery allows us to write our code without any help of parseInt function. Let see modify example.

Image

By using jQuery we can write this code in very easy style by creating an Object for css property because as we use css property in last modify example this is not the right way let see the right concept by using an Object.

Image

Here we also can use animate method behalf of css property for change css property in some style.

Image

In above example we use animate method. It's increasing the font size but not changing the color, Because animate method don't have to permission for change elements color property. Let modify this example.

Image

Use some of these methods together in simple steps

Image

One more useful way

Image

So in this lesson we learn how can we fully control on animation. Watch the examples again and create your own animations. Happy Coding. Good Bye.


Wconcert India © 2015   ·   All Rights Reserved

Free Web Hosting