Have Geek Brain

Fade DIV with cool animation

I slowly fade away DIV,

$(ele).fadeIn('slow');

How can I create a very nice animation together with fadeIn to show the real power of jquery animation

+1


a source to share


3 answers


You can also check out jQuery UI as it allows you to animate colors or read this article about plugins for a great user experience.



+3


a source


What kind of animation are you looking for? You can slideDown () , slideUp () or use animate () and define your own



+2


a source


You can easily do multiple animations in jquery:

/*you can hide your item with the css property first*/

<style>
 #id_of_what_want_to_animate{display:none;height:1px;}
</style>

then expand it with jquery

//target the item that triggers the animation
$('#clickthis').click(function() {
   //when clicked animate whatever you want, the 5000 is the duration of the animation in
   //milliseconds inside the curly braces you can animate css properties   
  $('#id_of_what_want_to_animate').animate({opacity: 1,height: '200px'},5000,function() {
    //run something else when your animation complete.
  });
});

you can refer to the detailed jquery documentation at:

http://api.jquery.com/animate/

0


a source






More articles:


All Articles