Untitled

 <html>
 <head>
 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript"> 
    $(document).ready(function() 
    { 
	$("input.buttonBslidedown").click(function(){ $("div.contentToChange").find("p.firstparagraph:hidden").slideDown("slow"); });
	$("input.buttonBslideup").click(function(){ $("div.contentToChange").find("p.firstparagraph:visible").slideUp("slow"); });

    })
    </script>

 </head>
 <body>
<input type="image" src="image.jpg" value="Slide Out" class="buttonBslideup" />
<input type="image2" src="image2.jpg" value="Slide In" class="buttonBslidedown" />
<center>
<div style="float;width:800;background:#dce6ed;" class="contentToChange">

<p class="firstparagraph">Anything typed here will be hidden and showne when you click the image.jpg buttons..</p>
 </body>
 </html>