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
<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>