Tuesday, November 18, 2008

How to Show/Hide SharePoint QuickLaunch


The bulk of this comes from http://suguk.org/blogs/sharepointhack/archive/2008/01/29/8093.aspx

Insert the following JavaScript block immediately before the </Head> tag in your master page:


<!--
function showhide(layer_ref)
{
var state = 'block';

var tbl = document.getElementById(layer_ref);
var img = document.getElementById("img" + layer_ref);

if (tbl.style.display == 'block')
{
tbl.style.display = 'none';
img.src = "_layouts/images/BLK_RGT.GIF";
}
else
{
tbl.style.display = 'block';
img.src = "_layouts/images/BLK_LEFT.GIF";
}
}
//-->
</script>

I put the following div immediately inside the TD with ID LeftNavigationAreaCell:
<div id="divOuterQuickLaunch" style="display:block;">

I added the following immediately after the ContentPlaceHolder PlaceHolderTitleAreaSeparator:

<tr>
<td style="text-align:right;">
<a id="lnkregionalNav" style="cursor:hand" onclick="showhide('divOuterQuickLaunch');">
<img src="_layouts/images/BLK_LEFT.GIF" id="imgdivOuterQuickLaunch" alt="Show/Hide Quicklaunch"/>
</a>
</td>
</tr>


If you are looking at a list, the behavior will not be as expected as there is an image at the top of the page that prohibits the quicklaunch area from collapsing when hidden. To correct this, find the ContentPlaceHolder PlaceHolderPageImage and add Visible=”false”

That should do it.

No comments: