imgout=new Image(9,9);

imgin=new Image(9,9);

 

        imgout.src="http://www.thesunnymelon.com/img/ico_maximise.gif";

        imgin.src="http://www.thesunnymelon.com/img/ico_minimise.gif";

 

 

//this switches expand collapse icons

function filter(imagename,objectsrc){

        if (document.images){

                document.images[imagename].src=eval(objectsrc+".src");

        }

}

 

//show OR hide funtion depends on if element is shown or hidden

function shoh(id) {

       

        if (document.getElementById) { // DOM3 = IE5, NS6

                if (document.getElementById(id).style.display == "none"){

                        document.getElementById(id).style.display = 'block';

                        filter(("img"+id),'imgin');                    

                } else {

                        filter(("img"+id),'imgout');

                        document.getElementById(id).style.display = 'none';                    

                }      

        } else {

                if (document.layers) { 

                        if (document.id.display == "none"){

                                document.id.display = 'block';

                                filter(("img"+id),'imgin');

                        } else {

                                filter(("img"+id),'imgout');   

                                document.id.display = 'none';

                        }

                } else {

                        if (document.all.id.style.visibility == "none"){

                                document.all.id.style.display = 'block';

                        } else {

                                filter(("img"+id),'imgout');

                                document.all.id.style.display = 'none';

                        }

                }

        }

}

 

 

<script type="text/javascript" src="http://www.thesunnymelon.com/inc/collapse_expand.js"></script>

          <div class="clear">

            <div id="Prices">

              <div class="PriceList" id="July">

                <div class="PriceListHeader">

                                <a href="#july" onClick="shoh('july');" ><img src="http://www.thesunnymelon.com/img/ico_maximise.gif" name="imgjuly" border="0" alt="" /></a><strong> July 2009</strong></div>

                                <div style="display: none;" id="july" >

                <div class="PriceListBodyExpand">

                  <table width="100%" border="0" cellspacing="0" cellpadding="4">

                    <tr>

                      <th>&nbsp;</th>

                      <td align="center"><strong>18th - 24st</strong></td>

                      <td align="center" nowrap="nowrap"><strong>25th - 31st</strong></td>

                    </tr>

                    <tr>

                      <th>Bed in Triple</th>

                      <td width="20%" align="center">€869,-</td>

                      <td width="20%" align="center" nowrap="nowrap" class="PriceAvailable">Still Available</td>

                    </tr>

                    <tr>

                      <th bgcolor="#FFFFCC">Bed in Twin</th>

                      <td align="center" bgcolor="#FFFFCC">€899,-</td>

                      <td align="center" bgcolor="#FFFFCC" class="PriceBooked">Fully Booked</td>

                    </tr>

                    <tr>

                      <th bgcolor="#FFFFCC">Bed in Double</th>

                      <td align="center" bgcolor="#FFFFCC">€899,-</td>

                      <td align="center" bgcolor="#FFFFCC" class="PriceBooked">Fully Booked</td>

                    </tr>

                  </table>

                </div>

              </div>

            </div>

                  <div class="PriceList" id="August">

                <div class="PriceListHeader">

                                <a href="#august" onClick="shoh('august');" ><img src="http://www.thesunnymelon.com/img/ico_maximise.gif" name="imgaugust" border="0" alt="" /></a> <strong>August 2009</strong></div>

                                <div style="display: none;" id="august" >

                    <div class="PriceListBodyCollapse">

                  <table width="100%" border="0" cellspacing="0" cellpadding="4">

                    <tr>

                      <th>&nbsp;</th>

                      <td align="center"><strong>18th - 24st</strong></td>

                      <td align="center" nowrap="nowrap"><strong>25th - 31st</strong></td>

                    </tr>

                    <tr>

                      <th>Bed in Triple</th>

                      <td width="20%" align="center">€879</td>

                      <td width="20%" align="center" nowrap="nowrap" class="PriceAvailable">Still Available</td>

                    </tr>

                    <tr>

                      <th bgcolor="#FFFFCC">Bed in Twin</th>

                      <td align="center" bgcolor="#FFFFCC">€879</td>

                      <td align="center" bgcolor="#FFFFCC" class="PriceBooked">Fully Booked</td>

                    </tr>

                    <tr>

                      <th>Bed in Double</th>

                      <td align="center">€879</td>

                      <td align="center" class="PriceBooked">Fully Booked</td>

                    </tr>

                  </table>

                </div>

              </div>

            </div>

              <div class="PriceList" id="September">

                <div class="PriceListHeader">

                                <a href="#september" onClick="shoh('september');" ><img src="http://www.thesunnymelon.com/img/ico_maximise.gif" name="imgseptember" border="0" alt="" /></a><strong>September 2009</strong></div>

                                <div style="display: none;" id="september" >

                <div class="PriceListBodyCollapse">

                  <table width="100%" border="0" cellspacing="0" cellpadding="4">

                    <tr>

                      <th>&nbsp;</th>

                      <td align="center"><strong>29th - 4th</strong></td>

                      <td align="center" nowrap="nowrap"><strong>5th - 11th</strong></td>

                    </tr>

                    <tr>

                      <th>Bed in Triple</th>

                      <td width="20%" align="center">€849,-</td>

                      <td width="20%" align="center" nowrap="nowrap" class="PriceAvailable">Still Available</td>

                    </tr>

                    <tr>

                      <th bgcolor="#FFFFCC">Bed in Twin</th>

                      <td align="center" bgcolor="#FFFFCC">€879,-</td>

                      <td align="center" bgcolor="#FFFFCC" class="PriceBooked">Fully Booked</td>

                    </tr>

                    <tr>

                      <th bgcolor="#FFFFCC">Bed in Double</th>

                      <td align="center" bgcolor="#FFFFCC">€879,-</td>

                      <td align="center" bgcolor="#FFFFCC" class="PriceBooked">Fully Booked</td>

                    </tr>

                  </table>

                  </div>

                </div>

            </div>

            </div>

                            <p>&nbsp;</p>

              </div>