0

hi,
i looking for a dropdown menu something like this:

http://www.lwis.net/free-css-drop-down-menu/dropdown.ultimate.horizontal.html

but without jquery javascript or complex javascript.
the reason for mininum javascript if possible is that i use
many javascript already for other operations like ajax etc
and if i add jquery etc all functions simple donĀ“t work :(
so i looking for a solution based only in css if possible that can
dropdown and work in all browsers ie6 inclusive.
thanks a lot for your help
:)

5
Contributors
4
Replies
5
Views
7 Years
Discussion Span
Last Post by sam023
0

I'm pretty certain you are going to have to use a little js to get this to work. Generally you would have a horizontal unordered list whose list elements contain an anchor tag and a div whose display property is set to none. Then you have an onmouseover and onmouseout event that would set the div's display to "" and "none" respectively. No JQuery is necessary.

<ul>
  <li style="float:left" onmouseover="document.getElementById('myDiv').style.display='';" onmouseout="document.getElementById('myDiv').style.display='none';"
<div id=myDiv>stuff</div>
</li>
</ul>
0

javascript onmouseover onmouseout are unneccessary BS
css menus use
ul {}
ul.hover {}

definitions to achieve the same effect
try one of the sites that offer to code it for you

http://purecssmenu.com/

Edited by almostbob: n/a

0

Menus can be created with 100% CSS, 0% javascript. Here

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <meta name="generator" content=
    "HTML Tidy for Windows (vers 25 March 2009), see www.w3.org">
    <style type="text/css">
.menu {
    color: white;
    font-family: Tahoma;
    font-size: 8pt;
    font-weight: bold;
    border-right: 1px solid white;
    text-decoration: none;
    background-color: #313031;
    padding: 5px;
    }

    .menu:hover {
    background-color: #5A8EC6;
    }

    .toolbar {
    background-color: #313031;
    padding: 5px 0px 5px 0px;
    }

    </style>
    <title></title>
  </head>
  <body>
    <div class="toolbar">
      <a class="menu" href="menu1.html" title=
      "Visit Menu Item 1">&nbsp;Menu Item 1</a><a class="menu"
      href="menu1.html" title="Visit Menu Item 2">&nbsp;Menu Item
      2</a><a class="menu" href="menu1.html">&nbsp;Menu Item 3</a>
    </div>
  </body>
</html>

is a toy example.

The framework available at http://www.lwis.net/free-css-drop-down-menu/ does the same thing, BIG time :) If the DaniWeb menus aren't built with it, they could be.
For most browsers implementation is completely script-free; IE6 support does use some javascript/jquery [included].

0

this cool Menu contain no javascript at all.. it is based on complete CSS.. this may help you..

Edited by sam023: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.