CODEWITHSUNDEEP
c#javascriptasp.netcssdrop-down-menu
special life
special life

Reputation: 225

how to create horizontal drop-down menu with javascript for asp.net website?

i am developing i website using master page this master page doesn't has any menus but i want to create a javascript menu for one of the content page and this page will navigate to other pages the will have the same menu always appeared there.

i am using c# and asp.net so how to do that and make this menu also fixed among all selected items (and see which one selected by some css) .

i hope that i described well what i need because i am so confused so sorry for that.

Upvotes: 0

Views: 7875

Answers (1)

Peter Kiss
Peter Kiss

Reputation: 9319

You don't need JS for this. There are many solution for this you just did not used the right keywords. Try search for: horizontal drop down menu css

The first step is to create a nested ul-li-ul-li structure:

<ul id="coolMenu">
    <li><a href="#">Lorem</a></li>
    <li><a href="#">Mauricii</a></li>
    <li>
        <a href="#">Periher</a>
        <ul>
            <li><a href="#">Hellenico</a></li>
            <li><a href="#">Genere</a></li>
            <li><a href="#">Indulgentia</a></li>
        </ul>
    </li>
    <li><a href="#">Tyrio</a></li>
    <li><a href="#">Quicumque</a></li>
</ul>

Then apply a few CSS rules.

#coolMenu,
#coolMenu ul {
    list-style: none;
}
#coolMenu {
    float: left;
}
#coolMenu > li {
    float: left;
}
#coolMenu li a {
display: block;
    height: 2em;
    line-height: 2em;
    padding: 0 1.5em;
    text-decoration: none;
}
#coolMenu ul {
    position: absolute;
    display: none;
z-index: 999;
}
#coolMenu ul li a {
    width: 80px;
}
#coolMenu li:hover ul {
    display: block;
}

Further code: http://www.cssnewbie.com/horizontal-dropdown-menus/

Other solution: http://matthewjamestaylor.com/blog/centered-dropdown-menus

Upvotes: 3

Related Questions