SharePoint - Hide the vertical menu in wss3.0

Asked By begennerSharpoint on 12-Jun-11 03:27 PM
Hi every body , i want t hide the vertical menu for such users in sharepoint wss3.0 how i can do this ? thanks in advance
Ravi S replied to begennerSharpoint on 12-Jun-11 09:51 PM
hI

try this

1. Menu with simple show/hide effect
Step 1.1: HTML Code

This is the basic example with a simple show/hide effect which you can implement just with some lines of JavaScript code (see next step). Our menu is a <ul> list wih a button (link) which calls a simple javascript function showElement() in the next step. HTML code is the following and you can customize it how you prefer simply changing the CSS code in the source file:

<a href="#" class="button" onclick="javascript:showElement('v-menu')">
<span>
Click Here</span>
</a>
<ul id="v-menu" class="v-menu" style="display:none;">
<li><a href="p1.html">Technology</a></li>
<li><a href="p2.html">Design</a></li>
<li><a href="p3.html">Css Gallery</a></li>
<li><a href="p4.html">Entertainment</a></li>
<li><a href="p5.html">Programming</a></li>
</ul>

Remember to add the property "display:none" in the ul element to hide the menu when an user load the page (it will appear only when an user clicks on the button).

1. Menu with simple show/hide effect
Step 1.2: JavaScript function

Now, in the head tag of the page, add this simple script to show/hide a generic HTML element using CSS display property:

<script type="text/javascript">
function showElement(layer){
var myLayer = document.getElementById(layer);
if(myLayer.style.display=="none"){
myLayer.style.display="block";
myLayer.backgroundPosition="top";
} else { 
myLayer.style.display="none";
}
}
</script>

showElement() function take in input the ID of the HTML element you want to show/hide. When an user clicks the button and CSS display property is set to "none" (menu hidden) this script will set the property with a new value "block" (menu visible).
Ravi S replied to begennerSharpoint on 12-Jun-11 09:53 PM