HTML / CSS - Aiuto User menu!

Forum - HTML / CSS - Aiuto User menu!

Daniele93 (Normal User)
Expert

Messaggi: 226
Iscritto: 29/05/2009

Postato alle 19:47
Sabato, 16/01/2010

Salve a tutti! Volevo sapere se si può tramite un' immagine con mappe (è già pronta)creare un ' user menu ovvero lasciarla sempre in basso allo schermo , esattamente come in questo momento la vostra barra di questo sito, sò che questa non è un' immagine, ma io vorrei realizzarla con un' immagine. Grazie 1000 a tutti e buon sabato sera!

Ultima modifica effettuata da Daniele93 il 16/01/2010 alle 19:47

cassin.simone (Member)
Guru

Messaggi: 1051
Iscritto: 03/06/2009

Postato alle 21:11
Sabato, 16/01/2010

Testo quotato

Postato originariamente da Daniele93:

Salve a tutti! Volevo sapere se si può tramite un' immagine con mappe (è già pronta)creare un ' user menu ovvero lasciarla sempre in basso allo schermo , esattamente come in questo momento la vostra barra di questo sito, sò che questa non è un' immagine, ma io vorrei realizzarla con un' immagine. Grazie 1000 a tutti e buon sabato sera!

Basta che usi i css e definisci la posizione :k:

Xaratroom (Ex-Member)
Expert

Messaggi: 526
Iscritto: 03/04/2008

Postato alle 16:44
Domenica, 17/01/2010

Testo quotato

Ti basta usare l'attributo position in modo opportuno e lavorare sull'attributo display per la visibilità...
Quindi CSS e Javascript... Se in javascript sei alle prime armi con i DOM ti consiglio di usare jquery, che ti semplifica la vita

Daniele93 (Normal User)
Expert

Messaggi: 226
Iscritto: 29/05/2009

Postato alle 16:52
Domenica, 17/01/2010

Con i javascript sono a 0! Hehehe...
Comunque ho messo

Codice sorgente - presumibilmente Plain Text

<img src="menu.png" style="position:fixed; bottom:60px" />

Ma come gli dico di stare empre sul fondo? adesso sta sempre a 60px...

GRAZIE!!!

Xaratroom (Ex-Member)
Expert

Messaggi: 526
Iscritto: 03/04/2008

Postato alle 17:22
Domenica, 17/01/2010

Dovresti fare qualcosa di questo tipo:

Codice sorgente - presumibilmente Plain Text

#usermenu {
        position: fixed;
        bottom: 0px;
        left: 50%;
        margin-left: -300px;
        height: 40px;
        width: 600px;
}
#submenu {
        position: fixed;
        bottom: 40px;
        right: 50%;
        height: 100px;
        width: 300px;
        display: none;
}

Codice sorgente - presumibilmente HTML / CSS

function visualizza (id) {
        document.getElementById(id).style.display = "";
}

Codice sorgente - presumibilmente HTML / CSS

<div id="submenu">
                        ...
</div>
<div id="usermenu">
        <img src="..." width="600px" height="40px" usemap=”mappa” border="none" />
        <map name=”mappa”>
                <area shape="rect" coords="0, 0, 60, 40" href="javascript:visualizza('#submenu');" alt="Apri menu" />
        </map> 
</div>

Daniele93 (Normal User)
Expert

Messaggi: 226
Iscritto: 29/05/2009

Postato alle 17:28
Domenica, 17/01/2010

Bisogna quindi per forza usare javascript... io uso solo il menu non i submenu, comuqnue grazie 1000!

Xaratroom (Ex-Member)
Expert

Messaggi: 526
Iscritto: 03/04/2008

Postato alle 2:29
Lunedì, 18/01/2010

Testo quotato

Postato originariamente da Daniele93:

Bisogna quindi per forza usare javascript... io uso solo il menu non i submenu, comuqnue grazie 1000!

Ah scusami avevo capito male ...
Per creare un menù sempliciotto non hai bisogno di niente....
Ti basta usare position impostato a fixed con bottom impostato a 0px.
Se vuoi puoi anche centrarlo usando la stessa tecnica che ho postato prima:

Codice sorgente - presumibilmente Plain Text

left: 50%;
margin-left: -300px;
width: 600px;

Andrey (Normal User)
Rookie

Messaggi: 29
Iscritto: 06/10/2009

Postato alle 1:24
Domenica, 24/01/2010

Comunque il parametro passato a "visualizza()" va senza il "#".