replace a div with another div

[g00fyman]

hi all, i am writing a custom server control for asp.net and i need to implement some javascript to replace a hidden div with a div that is already visible then set the replaced div to visible. at the moment it is working but when i simply toggle visibiity the div is not displayed at the same position within its parent div this is my javascript include.

function ShowPanel(panel)
{
for(var i = 0; i < resources.length; i++)
{
var res = resources[i];
var obj = document.getElementById(res);
if(obj)
{
obj.style.visibility = 'hidden';
}
}
panel = document.getElementById(panel);
if(panel) { panel.style.visibility = "visible"; }
}

and this is my output for the javascripts vars

<script type="text/javascript">
<!--
var resources = new Array('ToolbarStart', 'ToolbarBackground', 'ToolbarEnd', 'ToolbarSeperator', 'ToolbarHome', 'ToolbarCopy', 'ToolbarDelete', 'ToolbarFolderUp', 'ToolbarMove', 'ToolbarNewFile', 'ToolbarNewFolder', 'ToolbarRename', 'ToolbarUpload', 'ToolbarDownload', 'ToolbarZip', 'ToolbarAbout', 'ToolbarSettings', 'ToolbarSaveAsXml', 'ToolbarPrintStructure', 'ToolbarFileSystem');
var useTransitions = true;// --></script>

and this is the divs i want to replace with each other

<div id="ActionsPanel">
<div>
<div id="ToolbarUpload" style="visibility:hidden;top:5px;left:5px;z-index:3;">
blah blah blah
</div><div id="ToolbarDownload" style="visibility:hidden;top:5px;left:5px;z-index:4;">

					blah blah blah
				</div><div id="ToolbarRename" style="visibility:hidden;top:5px;left:5px;z-index:5;">
					blah blah blah
				</div>
			</div>
		</div>

any help please? regards, g00fy

[Guffa]

Use display instead of visibility. Making an element invisible doesn't remove it from the page flow, it will still take up space.

--- b { font-weight: normal; }

[g00fyman]

thanks guffa, i knew that but forgot it, just needed a kick in the head to remind me. g00fy :D

[Guffa]

g00fyman wrote:

just needed a kick in the head to remind me

Glad to be able to kick you. ;)

--- b { font-weight: normal; }