View Single Post
  #2  
Old 15th Oct 06, 06:48 PM
robinwilson16 robinwilson16 is offline
Administrator
 
Join Date: Jul 2001
Location: UK
Posts: 903
robinwilson16 will become famous soon enoughrobinwilson16 will become famous soon enough
Fixed it for you

It now differentiates between the galleries and displays different text depending upon which was clicked. It expands when you click a gallery and contracts if you click the same gallery again or if you clicked another gallery it contracts the old one then expands the new one.
The contents for each gallery can be modified at the top of the script.

Hope this is what you wanted.
Robin

Code:
<script language="JavaScript" type="text/javascript"> var gall1 = "Gallery 1 Content Here"; var gall2 = "Gallery 2 Content Here"; var curnum = 0; var resizeIntervalId = null; function startResize(id, height, num) { clearInterval(resizeIntervalId); resizeIntervalId = setInterval("resize('" + id + "', " + height + ", " + num + ");",1); } function slide(id, num) { var element = document.getElementById(id); if(parseInt(element.style.height) == 100) { startResize(id, 0, num); if(parseInt(element.style.height) <= 90) { startResize(id, 100, num); curnum = num; } } else { startResize(id, 100, num); curnum = num; } } function resize(id, height, num) { var element = document.getElementById(id); var nextSize; if(parseInt(element.style.height) == height) { if (curnum != num) { clearInterval(resizeIntervalId); startResize(id, 100, num); curnum = num; return; } else { clearInterval(resizeIntervalId); return; } } else if(parseInt(element.style.height) > height) { nextSize = parseInt(element.style.height) - 10; } else { nextSize = parseInt(element.style.height) + 10; } element.style.height = nextSize + "px"; if((parseInt(element.style.height) == height)&&(parseInt(element.style.height) > 1)&&(num == 1)) { document.getElementById("imageGallery").innerHTML = gall1 } else if((parseInt(element.style.height) == height)&&(parseInt(element.style.height) > 1)&&(num == 2)) { document.getElementById("imageGallery").innerHTML = gall2 } else { document.getElementById("imageGallery").innerHTML = "" } } </script> <table width="100%" align="left"> <td width="100"> <a href="#" onClick="javascript:slide('slider', 1);">Gallery 1</a> <br> <a href="#" onClick="javascript:slide('slider', 2);">Gallery 2</a> </td> <Td id="slider" style="width:100px; height:0px; background-color:white;" nowrap> <div id="imageGallery"></div> </TD> </table>
Reply With Quote