JQuery fadein/fadeout help

please give me JQUERY code fadein/fadeout
here is example
when About link is clicked the decription below will show/hide in fading effect

 

Hi!

Try These 3 JQuery FadeIn / FadeOunt Examples.

Emample 1:

<script type="text/javascript">
$(document).ready(function(){
	$(".latest_img").fadeTo("slow", 0.3); // This sets the opacity of the thumbs to fade down to 30% when the page loads
	$(".latest_img").hover(function(){
	$(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
	},function(){
	$(this).fadeTo("slow", 0.3); // This should set the opacity back to 30% on mouseout
	});
});
</script>

<div id="images">
	<a href="#"><img src="images/01.png" width="121" height="83" border="0" class="latest_img" /></a>
    <a href="#"><img src="images/02.png" width="121" height="83" border="0" class="latest_img" /></a>
    <a href="#"><img src="images/03.png" width="121" height="83" border="0" class="latest_img" /></a>
    <a href="#"><img src="images/04.png" width="121" height="83" border="0" class="latest_img" /></a>
</div>

Code (markup):

Emample 2:

<script type="text/javascript">
$(document).ready(function(){
    $("#text p").fadeTo("slow", 0.3); // This sets the opacity of the thumbs to fade down to 30% when the page loads
    $("#text p").hover(function(){
    $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
    },function(){
    $(this).fadeTo("slow", 0.3); // This should set the opacity back to 30% on mouseout
    });
});
</script>

<div id="text">
	<p>
    	Your Text
	</p>
</div>

Code (markup):

Emample 2:

<script type="text/javascript">
$(document).ready(function(){
	 $("#div").fadeTo("slow", 0.3); // This sets the opacity of the thumbs to fade down to 30% when the page loads
	 $("#div").hover(function(){
	 $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
	 },function(){
	 $(this).fadeTo("slow", 0.3); // This should set the opacity back to 30% on mouseout
		  });
});
</script>

<div id="div">
	<a href="#"><img src="images/01.png" width="121" height="83" border="0" class="img" /></a>
    <a href="#"><img src="images/02.png" width="121" height="83" border="0" class="img" /></a>
    <a href="#"><img src="images/03.png" width="121" height="83" border="0" class="img" /></a>
    <a href="#"><img src="images/04.png" width="121" height="83" border="0" class="img" /></a>
</div>

Code (markup):