Manu a tendina... solo testo

**radiodelmomento** · 26-02-2011, 14.31.17

Salve a tutti.
Vorrei creare un menu a tendina come quello di Google (quando si clicca su Altro).
Cioè dev'essere un testo che appena si clicca compare il menu.
Grazie per eventuali risposte.

26-02-2011, 16.05.02

Dovresti cercare su google "menù a tendina in java" ne esistono molti tipi forse anche di più belli.

**sevenjeak** · 26-02-2011, 17.45.47

Perché dovrebbe farlo in Java, se mai in Javascript.

Cmq per quei menu basterebbe usare solo i fogli di stile, dai un'occhiata qui:

http://css.html.it/articoli/leggi/43...olo-con-i-css/

28-02-2011, 14.41.17

Prova così, poi magari modifichi come vuoi:

Codice HTML:

<html>
<head>
<script type="text/javascript">
function visibile(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>
<style type="text/css">
li {
background: red;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
list-style-type: none;
width: 100px;
}

li:hover {
background: red;
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

a:link {
color: white;
text-decoration: none;
}

a:hover {
color: red;
}

a:visited {
color: white;
}
</style>
</head>
<body>
<span style="background-color: blue;">| <a href="#">Home</a> | <a href="#" onclick="visibile('add');">Altro</a> | </span>
<div id="add" style="display: none;">
<ul>
<li>Test1</li>
<li>Test2</li>
<li>Test3</li></ul></div>
</body>
</html>

**radiodelmomento** · 28-02-2011, 16.40.59

Originalmente inviato da exabyte

Prova così, poi magari modifichi come vuoi:

Codice HTML:

<html>
<head>
<script type="text/javascript">
function visibile(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>
<style type="text/css">
li {
background: red;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
list-style-type: none;
width: 100px;
}

li:hover {
background: red;
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
}

a:link {
color: white;
text-decoration: none;
}

a:hover {
color: red;
}

a:visited {
color: white;
}
</style>
</head>
<body>
<span style="background-color: blue;">| <a href="#">Home</a> | <a href="#" onclick="visibile('add');">Altro</a> | </span>
<div id="add" style="display: none;">
<ul>
<li>Test1</li>
<li>Test2</li>
<li>Test3</li></ul></div>
</body>
</html>

Da modificare un po' ma va bene, grazie mille!

28-02-2011, 16.44.51

Figurati, era solo per farti capire i codici base per farlo

Discussione: Manu a tendina... solo testo

LinkBack

Strumenti discussione

Display

Manu a tendina... solo testo

Regole di scrittura