Pages

Subscribe:

Ads 468x60px

Thursday, 8 September 2011

Outlook Style Menu with Collapsable Side Menu



Introduction

I have read an article at http://www.codeproject.com/useritems/XPMenu.asp  which explains the dropdown XP style menu.
Just I would like to add new features,
  1. Collapsable side menu.
  2. Change the XP style menu in to Outlook style bar.(Using CSS File "SlideMenu.css")
I think that most developers suffer from the problem of the design of the menu, needs thier application GUI like Outlookor XP Style,
Therefore I think that this menu will provide solution to their problem.

Source code contains
  • SlideMenu.css file
  • menu.js file

Import Css file in your page
<LINK href="SlideMenu/images/SlideMenu.css" type="text/css" rel="stylesheet">

Collapsable side menu feature permit to hide side menu from page as a client script
Hide menu function:
<script type="text/javascript">
function lefthide()

{
    var fr = parent.document.getElementById("sbCont");
    if(fr.style.display=="")
    {
        fr.style.display="none";
        change('outlookside''outlookBarExpand')
    }
    else
    {
        fr.style.display="";
        change('outlookside''outlookBarcollapse')
    }
}
function change(id, newClass)
{
    identity=document.getElementById(id);
    identity.className=newClass;
}
</script>


I hope that I have succeeded in making this article and I wish to be useful to others.

0 comments:

Post a Comment