Css menu problemi

[Davides98]

ho creato un menu css con :hover quindi al passaggio del mouse si "illumina";
ma ho un problema vorrei che quando clicco su una voce del menu questa rimani "illumniata" fino a quando sono nella pagina corrente; mi spiego meglio:
menu:
pagina1
pagina2
pagina3
pagina4
clicco su pagina2, quindi mi trovo nella pagina2
e il menu diventa
pagina1
pagina2
pagina3
pagina4
clicco su pagina3, quindi mi trovo nella pagina3
e il menu diventa
pagina1
pagina2
pagina3
pagina4

e cosi via

[ac_socmel]

mostra un link

[Davides98]

in base alla pagina metti nella voce di menù una classe ad esempio: class="active" e sul css metti .active{font-weight:bold;}...
fammi sapere

Il problema di active è che quando smetto di tenere premuto il mouse la voce del menu ritorna normale io volevo che mentre ero nella pagina es.2 rimanesse sempre di quel colore

[Felino]

Nel primo caso stai richiamando una proprietà del CSS che è a:hover , cioè quando sei sopra un link questo assume certe proprietà, esempio:

<a href="link_pagina">pagina1</a>

In questo caso se nel tuo CSS metti:

a {
     color: #000000;
}
a:hover{
     color: #F9F7ED;
}

quando passi sulla voce del menu il colore del testo passa da #000000 a #F9F7ED (in questo caso questa modifica vale per tutti i link del tuo sito!)

Se nel tuo codice scrivi:

<a href="link_pagina" class="active">pagina1</a>

solo quando sei sulla pagina1 (quindi è un'associazione che devi fare dinamicamente in base alla pagina).

In questo caso se nel tuo CSS metti:

.active {
     text-decoration: underline;
}

il link assume la classe active e quindi rimane sottolineato.

Spero di esserti stato utile.

[Davides98]

file css
#menu a { border-bottom: 1px solid #ddd; padding: 1em; font-family: "Verdana"; font-size: 15px; display: block; text-decoration:none;}
#menu a:hover{background:#FF0000;}
.active{background-color: #000000;}
file html
<div id="menu">
<li><a href="#page1" class="active" >Scopri Grend</a></li>
<li><a href="#page2" >Accedi</a></li>
<li><a href="#page3" >Registrati</a></li>
<li><a href="#page4" >Contattaci</a></li>
</div>

Risultato
aaaa.jpg

[Davides98]

leggi sopra grazie per la disponibilità

[Felino]

leggi sopra grazie per la disponibilità

Riferito a chi?

[Davides98]

riferito a chiunque

[Felino]

Non capisco, sii più chiaro.

Grazie.

[aramun]

basta il #div a:active{}