agis
agis

Reputation: 1841

jquery smooth effect

I want to make something similar with this

When you click on "description" text appears. I want to create this effect with jQuery, how can I make this?

Upvotes: 1

Views: 1705

Answers (3)

matchew
matchew

Reputation: 19645

Perhaps a fadeToggle() ?

<a href="#" id="appear">Clicky</a>
    <p class="textTo" style="display: none;">Hello World!</p>

<script type="text/javascript">
$("#appear").click(function() {
   $(".textTo").fadeToggle();
});
</script>

check out the working fiddle: http://jsfiddle.net/vfcp4/

and the api:

http://api.jquery.com/fadeToggle/

the api shows a bit more.

for example there are some parameters to pass controlling animation speed, type, etc.

Upvotes: 0

Edgar Villegas Alvarado
Edgar Villegas Alvarado

Reputation: 18344

You can do it like this:

<div id="description"> Description (click here to show) </div>
<div id="textToShow" style="display:none"> Now I'm visible ! </div>

$(document).ready(function(){
  $("#description").click(function(){
    $("#textToShow").fadeIn("slow");
  });
});

You can use an image or any element to be shown. Hope this helps. Cheers

Upvotes: 0

DJafari
DJafari

Reputation: 13545

You can use fadeTo function in jquery

Upvotes: 2

Related Questions