• J
    User •

    Come si fa un menu attivo?

    Ciao ragazzi, premetto che sono nuovo del CSS per cui mi scuso se dico stupidaggini. In buona sostanza vorrei creare un menu in cui cliccando su un pulsante questo cambi di stato e permanga in quest'ultimo (per esempio. HOME in nero, ci clicco e permane rosso)

    Grazie della pazienza

    0
  • T
    User Attivo •

    I comandi da dare nel css dovrebbero essere i seguenti:
    a:link (definisce il link non ancora visitato)
    a:visited (definisce il link già visitato)

    spero ti sia utile.

    0
  • J
    User •

    @Taiku said:

    I comandi da dare nel css dovrebbero essere i seguenti:
    a:link (definisce il link non ancora visitato)
    a:visited (definisce il link già visitato)

    spero ti sia utile.

    Ho provato ma non è proprio quello che intendevo, ovvero se provo in questo modo i link mi restano rossi a mano a mano che li visito. Io vorrei invece che a seconda della sezione in cui mi trovo si illumini il link relativo. Grazie

    0
  • K
    Super User •

    Puoi usare uno stile globale per i link o magari uno riferito unicamente ai link di questo menù.
    In sostanza la differenza è che nel primo caso i vari stili ti si attribuirebbero generalmente a tutti i link della tua pagina sempre che tu non dichiari delle regole diverse per gli altri 🙂

    Il secondo caso nonchè quello più controllato è quello di fare così:

    • Ai link del menù a cui vorrai dare questi "effetti" aggiungi una classe così da poter definire degli stili su di essi.

    es:
    <a href="home.html" class="linkMenu">Home</a>
    <a href="chi_siamo.html" class=linkMenu">Chi siamo</a>

    Ora nel foglio di stile e cioè nel tuo .css definisci gli attributi di questa classe in questo modo:

    [html].linkMenu:link{
    color:#33333;
    background-color:#FFFFFF;
    }
    .linkMenu:hover{
    color:#FF6633
    background-color:#333333;
    }[/html]Allora questi sono i parametri per gestire l'effetto sui tuoi link al passaggio del mouse. Il primo ".linkMenu:link" si riferisce all'url del tuo menù in termini "generali" e cioè quando non è soggetto a nessun evento, l'altro invece ".linkMenu:hover" si riferisce al passaggio del mouse sopra di esso.

    Devi aggiungere anche altri parametri quali:

    .linkMenu:visited{}
    .linkMenu:active{}

    E inserire tra le parentesi quadre i tuoi attributi.
    Essi rappresentano: il link che è stato gia visitato e il link attivo.

    Naturalmente quelli che ho scritto sono solo un brevissimo elenco di quelli che puoi aggiungerci (esempio potrebbero essere i bordi per non scendere nel complicato 🙂 ).

    Spero di esserti stato di aiuto in caso illustra pure i tuoi dubbi, ciao! :yuppi:

    0
  • J
    User •

    Grazie mille, più che una risposta il tuo è un tutorial!!!

    0
Effettua l'accesso per rispondere