Javascript show/hidden

[ajax]

Така сложих си един джаваскрипт, и въпроса ми е :
-В момента ми е така имам стрелка(на снимката се вижда къде е) текста е от дясно и се вижда, но искам да не се вижда, а при кликване да се показва, и съм обяснил на картинката как да стане ако може, и при кликване да речем на горната стрелка(пак на снимката се вижда) да изчезва долния текст и горният да се покаже. Бая дълго стана и с снимката бая съм обяснил дано ме разберете да не пиша повече.
Ето кода :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>.:BG-DESIGN:.</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="styles.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/demo.js"></script>
<link rel="stylesheet" href="css/demo.css" type="text/css" />
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screeтоваn" />
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
</head>
<body>
<div id="content">
<div id="back">

<div id="header">
<div id="logo">
<span style="color:#c3c3c3; font-size:15px;">Welcome to</span><br />
		<span style="color:#b2b2b2; font-size:27px;">BG-DESIGN</span>
	</div>
 <div id="menu1">
  <div id="menu">
		<ul>
			<li id="button1"><a href="index.html"  title="начало">Начало</a></li>
			<li id="button2"><a href="portfolio.html" title="портфолио">Портфолио</a></li>
			<li id="button3"><a href="#" title="услуги">Услуги</a></li>
			<li id="button4"><a href="#" title="цени">Цени</a></li>
			<li id="button5"><a href="#" title="контакти">Контакти</a></li>
		</ul>
	</div>
 </div>
	
</div>


<div id="top"></div>
 <div id="main">
 <div id="boxes">
<div id="box1"><br /><center><a href="http://fifa-power.net" title="Fifa-Power.Net"><b><font color="#3399FF">Fifa-Power.Net</font></b></a></center><br />
	<a href="images/fifa-power/fifa-power.png" rel="lightbox[fifa-power]" title="Fifa-Power.Net"><img src="images/fifa-power/fifa-power.png" height="136" width="203" border="0"/></a>
	<a href="images/fifa-power/fifa-power2.png" rel="lightbox[fifa-power]" title="Fifa-Power.Net"></a>
	<a href="images/fifa-power/fifa-power3.png" rel="lightbox[fifa-power]" title="Fifa-Power.Net"></a>
	<a href="images/fifa-power/fifa-power4.png" rel="lightbox[fifa-power]" title="Fifa-Power.Net"></a>
	<a href="images/fifa-power/fifa-power5.png" rel="lightbox[fifa-power]" title="Fifa-Power.Net"></a>
    </div>
</div><br /><br />
<div id="main">
 <div id="box1" style="float:left;"><br /><center><a href="http://fifa-extreme.com" title="Fifa-Extreme.Com"><b><font color="#CC0000">Fifa-Extreme.Com</font></b></a></center><br />
	<a href="images/fifa-extreme/fifa-extreme.png" rel="lightbox[fifa-extreme]" title="Fifa-Extreme.Com"><img src="images/fifa-extreme/fifa-extreme.png" height="136" width="203" border="0"/></a>
	<a href="images/fifa-extreme/fifa-extreme2.png" rel="lightbox[fifa-extreme]" title="Fifa-Extreme.Com"></a>
	<a href="images/fifa-extreme/fifa-extreme3.png" rel="lightbox[fifa-extreme]" title="Fifa-Extreme.Com"></a>
    </div>
	<div style="padding-left:20px; padding-bottom:80px;"></div>
						<div class="portfolio">
			<table border="0">
			<tr>
			<td valign="top">
			<a id="h_toggle" href="#"><img src="images/line2.gif" border="0"/></a>
			</td>
			<td style="color:#B4B4B4" valign="bottom" width="350">
			<div class="marginbottom">
			<div id="horizontal_slide">
		    <div align="center">ХАХА ХА ХА  ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА ХАХА ХА ХА</div>
		    </div>
			</div>
			</td>
			<td valign="top">
			</td>
			<td width="120" valign="top">
			<br /><font color="#7bbb15"><b>TEST</b></font>
			<br><br><a href="#"><font color="#3a3a3a"><b>Още ифнорамция</b></font></а>
			</td>
			</tr>

			</table>
			</div>
   <div id="bottom" style="clear: both;"></div>
	</div>
	<div style="font-size: 5px;"> </div>



	</div>

<div id="footer">
<p>© <a href="#" title="BG-DESIGN">BG-DESIGN 2009</a></p>
	</div>
</div>
</div>

</body>
</html>

Ето снимката:
http://store.picbg.net/pubpic/33/6F/1647854325d7336f.jpg