Hi
i want to open menu option on clicking image and close menu option on clicking the same image .can you please help me?
For this image i want to open menu option ( left of departure)
<img src="images/dwn_arw.png" alt="" width="18" height="12" />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>First Group</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
<link href="style/scrollpanel.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="script/jquery.min.js"></script>
<script type="text/javascript" src="script/jquery.jscrollpane.min.js"></script>
</head>
<body>
<div id="wrapper">
<div class="login_cont">
<div class="topbar">
<div class="home_icon"><a href="#"><img src="images/back-arw.png" alt="Home" title="Home" /></a></div>
<h1 class="fr"><a href="#"><img src="images/icon1.png" alt="" /></a></h1>Departures
<a href="#"><img src="images/dwn_arw.png" alt="" width="18" height="12" /></a>
<div class="cl"></div>
</div>
<div class="mid_cont">
<div class="grid_cont">
<div class="from_cont">
<div class="fl width60"><input name="" type="text" class="frm_txtfield" width="80%" /></div>
<div class="fr"><input name="" type="button" class="heading_btn fr" value="Change" /></div>
<div class="cl"></div>
</div>
<div class="from_cont to_cont">
<div class="fl width60"><input name="" type="text" class="frm_txtfield" width="80%" /></div>
<div class="fr"><input name="" type="button" class="heading_btn fr" value="Change" /></div>
<div class="cl"></div>
</div>
<div id="scroll-pane">
<p>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr class="active">
<td width="30%" valign="top">P1</td>
<td width="30%" valign="top">09:05 - 14:15</td>
<td width="35%" valign="top">Glasgow (GLC)
<p><span>FC 2C03</span></p>
</td>
<td width="5%" align="left"><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P3</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P2</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/error-msg.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P4</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P4</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P4</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P4</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
<tr>
<td valign="top">P4</td>
<td valign="top">09:05 - 14:15</td>
<td valign="top">Glasgow (GLC)</td>
<td><img src="images/correct-icon.png" width="24" height="24" /></td>
</tr>
</table>
</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>