http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/ A Layout forum thread at WPDFD.com en-us 10/18/04, 292 40 2004 2004:%i:1098124834 18:40:34 02/09/12, 040 03 2012 2012:%i:1328807023 17:03:43 http://blogs.law.harvard.edu/tech/rss NineLabs Framework Feed Generator sitemaster@wpdfd.com sitemaster@wpdfd.com http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1440 10/18/04, 292 40 2004 2004:%i:1098124834 18:40:34 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1440 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1441 10/18/04, 292 17 2004 2004:%i:1098137847 22:17:27 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1441 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1442      {
     margin-top: 10px;
     margin-bottom: 20px;
     background-color: #eee9dd;
     width: 100%;
     height: 20px;
     display: block;
     position: relative;
     z-index: 10;
     background-image: url('../Graphic%20Menus/gmenu.png');
     background-repeat: repeat-x
     }

.menuendspacer
     {
     position: relative;
     display: block;
     width: 30px;
     height: 20px;
     float: left;
     }

#menubaritem1, #menubaritem2, #menubaritem3, #menubaritem4, #menubaritem5
     {
     background-color: transparent;
     position: relative;
     float: left;
     height: 23px;
     display: block;
     }
     
#menubaritem1 a, #menubaritem2 a, #menubaritem3 a, #menubaritem4 a, #menubaritem5 a
     {
     background-color: transparent;
     display: block;
     }
     
#menubaritem1 a:hover, #menubaritem2 a:hover, #menubaritem3 a:hover, #menubaritem4 a:hover, #menubaritem5 a:hover
     {
     background-color: #b6b1a8;
     display: block;
     }

#menu1
     {
     z-index: 10;
     position: absolute;
     margin-top: 20px;
     display: block;
     width: 100px;
     height: 100px;
     visibility: hidden;
     background-color: #f2f1e7;
     border-color: #fff #958774 #958774 #fff;
     border-width: 1px 1px 1px 1px;
     border-style: solid;
     }
     
.menuitem1 a
     {
     background-image: url('../Graphic%20Menus/m4bf.gif');
     background-repeat: no-repeat;
     display: block;
     position: relative;
     height: 20px
     }

     
.menuitem1 a:hover
     {
     background-image: url('../Graphic%20Menus/m4bn.gif');
     background-repeat: no-repeat
     }

     
#menu2
     {
     z-index: 10;
     background-color: transparent;
     position: absolute;
     margin-top: 20px;
     display: block;
     width: 100px;
     height: 80px;
     background-color: #f2f1e7;
     visibility: hidden;
     
     }
     
.menuitem2 a
     {
     background-image: url('../Graphic%20Menus/m4bf.gif');
     background-repeat: no-repeat;
     display: block;
     position: relative;
     height: 20px
     }

     
.menuitem2 a:hover
     {
     background-image: url('../Graphic%20Menus/m4bn.gif');
     background-repeat: no-repeat
     }

#menu3
     {
     z-index: 10;
     background-color: transparent;
     position: absolute;
     margin-top: 20px;
     display: block;
     width: 100px;
     height: 100px;
     background-color: #f2f1e7;
     visibility: hidden;
     border-color: #fff #aaa #aaa #fff;
     border-width: 1px 1px 1px 1px;
     border-style: solid;
     }
     
.menuitem3 a
     {
     background-image: url('../Graphic%20Menus/m4bf.gif');
     background-repeat: no-repeat;
     display: block;
     position: relative;
     height: 20px
     }

     
.menuitem3 a:hover
     {
     background-image: url('../Graphic%20Menus/m4bn.gif');
     background-repeat: no-repeat
     }

     
#menu4
     {
     z-index: 10;
     background-color: transparent;
     position: absolute;
     margin-top: 20px;
     display: block;
     width: 110px;
     height: 80px;
     background-color: #f2f1e7;
     visibility: hidden;
     border-color: #fff #aaa #aaa #fff;
     border-width: 1px 1px 1px 1px;
     border-style: solid;
     }
     
     
.menuitem4 a
     {
     background-image: url('../Graphic%20Menus/m4bf.gif');
     background-repeat: no-repeat;
     display: block;
     position: relative;
     height: 20px
     }

.menuitem4 a:hover
     {
     background-image: url('../Graphic%20Menus/m4bn.gif');
     background-repeat: no-repeat
     }

     
#menu5
     {
     border-left:1px solid #fff; border-right:1px solid #999; border-top:1px solid #fff; border-bottom:1px solid #999; z-index: 10;
     background-image: url('../Graphic%20Menus/girl.jpg');
     background-repeat: no-repeat;
     position: absolute;
     margin-top: 20px;
     display: block;
     width: 100px;
     height: 120px;
     visibility: hidden
     
     }
     
.menuitem5 a
     {
     background-color: transparent;
     position: relative;
     display: block;
     height: 20px;
     }
     
.menuitem5 a:hover
     {
     background-color: #fde2c6;
     }
     
     
-->
</style>
           <script type="text/javascript">
// <!--
var menus = 4;
var currentMenu = 0;
var selectedMenu = 0;
var clicked = false;
var ie = false;


if (navigator.userAgent.indexOf("MSIE"!=-1)
           {
           ie=true;
           }
     
           
function doBlur(n) // get rid of border
     {
     if (ie)
           {
           n.blur();
           }
     }

function selectMenu(m) // click on a menu header
     {
     if(clicked) // the menu is already active
           {
           clicked=false;
           selectedMenu=0;
           currentMenu=m;
           hideAll(-1)
           }
     else
           {
           clicked=true;
           selectedMenu=m;
           currentMenu=m;
           
           hideAll(m); // except m
           if(document.getElementById)
                 {
                 var themenu=document.getElementById("menu"+m);
                 themenu.style.visibility="visible";
                 }
           }
     }


function showMenu(m) // display a full menu on rollover
     {
     if(clicked)
           {
           hideAll(m);
           if(document.getElementById)
                 {
                 var themenubaritem=document.getElementById("menubaritem"+m);
                 themenubaritem.style.background="#b6b1a8";
                 var thermenu=document.getElementById("menu"+m);
                 thermenu.style.visibility="visible";
                 }
           }
           selectedMenu=0;
           currentMenu=m;
     }
     
     
function doMenuChoice(m,n) // click a menu item
     {
     selectedMenu=0;
     currentMenu=-1;
     hideAll(currentMenu);
     clicked=false;
     alert("You chose menu "+m+" item "+n);
     return false;
     }
     
     
function hideAll(e) // hide all menus except e
     {
     
           for(i=1;i<=menus;i++)
                 {
                 if(e!=i)
                       {
                       if(document.getElementById)
                             {
                             var themenubaritem=document.getElementById("menubaritem"+i);
                             themenubaritem.style.background="transparent";
                             var themenu=document.getElementById("menu"+i);
                             themenu.style.visibility="hidden";
                             }
                       }
                 }
     }
     

// -->
</script>
]]> 10/19/04, 293 20 2004 2004:%i:1098188429 12:20:29 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1442 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1443 10/19/04, 293 23 2004 2004:%i:1098206611 17:23:31 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1443 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1444 10/19/04, 293 12 2004 2004:%i:1098216758 20:12:38 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1444 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1445 10/20/04, 294 41 2004 2004:%i:1098265280 09:41:20 http://www.wpdfd.com/forums/wpdfd/layout/dropdown_menus/#p1445