problema con a:active

[ciammarica]

Ciao a tutti!
Ho un problemino... ho un link semplice semplice dentro a un div, in questo modo:

<div id="home"></div>

e ho questo CSS:

...
#home {

	position: relative;
	width: 114px;
	height: 83px;
	background: url(../images/home_off.gif) no-repeat;
}


a.home_img {

	display: block;
	width: 114px;
	height: 83px;
}


a.home_img:visited {

	display: block;
	width: 114px;
	height: 83px;
	background: url(../images/home_on.gif) no-repeat;
}


a.home_img:hover {

	display: block;
	width: 114px;
	height: 83px;
	background: url(../images/home_on.gif) no-repeat;
}


a.home_img:active {

	display: block;
	width: 114px;
	height: 83px;
	background: url(../images/home_on.gif) no-repeat;
}
...

Perche' a.home_img, a.home_img:hover e a.home_img:visited funzionano alla perfezione, mentre a.home_img:active no? in pratica vorrei che, se un link e' attivo, restasse visualizzata l'immagine home_on.gif... con "visited" funziona, con hover pure... perche' con "active" no?

[oronze]

prova spostando active prima di hover....non so perchè ma a me una volta da qualche parte mi dissero che c'era un ordine da seguire (non so se era una cacchiata ma poi spostando la pseudoclasse funzionò)...prova così e fammi sapere

edit: mi correggo...http://www.w3schools.com/css/css_pseudo_classes.asp

[ciammarica]

si', avevo letto questa cosa, e l'ordine mi pare quello specificato dal w3c (visited, hover, active)...
Non capisco proprio perche' non va

[ciammarica]

Scusate se riesumo questo post di tre settimane fa, ma ancora non riesco a risolvere il problema...
Nel frattempo pero' ho messo il sito on-line, cosi' magari vedendo nella pratica cio' che voglio ottenere e' piu' facile capire dov'e' il problema...

www.stefanopace.net

In pratica vorrei che l'effetto rollover delle pagine che sta sulle icone in alto (per esempio in index2.php e comics.php) restasse attivo se il link e' appunto attivo, in modo che l'utente capisca in che sezione si trova.
Il codice del CSS interessato e' quello che sta sul primo post di questa discussione.
Non capisco perche' con a:hover e a:visited funziona mentre con a:active no
Le ho provate tutte, cambiando l'ordine in ogni modo...

Qualche idea per aiutarmi?

Grazie mille!


P.S. Se scaricando la pagina del sito vedete che nel CSS non c'e' il codice per a:active e' normale, visto che non funzionava l'ho tolto! Comunque era esattamente quello che ho postato sopra.

[H5N1_Aviaria]

Ho controllato il css

li.menu a {

	display: block;
...
...
	border-bottom: 1px solid #e5e5e5;
}


li.menu a:hover {
...
	border-right: 2px solid #aaaaaa;
}

Come vedi mancano li.menu a:link , li.menu a:visited e li:menu a:active: devi impostarli nell'ordine.

li.menu a
li.menu a:link
li.menu a:visited
li.menu a:active
li.menu a:hover

L'unica pseudoclasse che vedo è a:hover...

[Mich_]

No, :active va messo per ultimo. http://www.w3schools.com/css/css_pseudo_classes.asp

Comunque credo che il probema sia che qualcuno non ha chiaro il concetto di link :active.
La situazione :active si presenta quando "il mouse e` sopra il link e il bottone del mouse e` premuto".

Quando si va in una pagina diversa, il link diventa un "falso link", nel senso che non ha utilita` pratica (se e` un vero link, riporta alla pagina attuale): sarebbe da inserire come link falso, una cosa del tipo:
[*]questo e` un link vero
<li class="falso">questo punterebbe alla stessa pagina[*]questo e` un link vero

dove la classe "falso" deve avere una formattazione uguale allo stato :active (oppure :hover) degli altri link.

[ciammarica]

Originariamente inviato da H5N1_Aviaria
Ho controllato il css

li.menu a {

	display: block;
...
...
	border-bottom: 1px solid #e5e5e5;
}


li.menu a:hover {
...
	border-right: 2px solid #aaaaaa;
}

Come vedi mancano li.menu a:link , li.menu a:visited e li:menu a:active: devi impostarli nell'ordine.

li.menu a
li.menu a:link
li.menu a:visited
li.menu a:active
li.menu a:hover

L'unica pseudoclasse che vedo è a:hover...

Si', lo so... l'ho scritto nel P.S. :

P.S. Se scaricando la pagina del sito vedete che nel CSS non c'e' il codice per a:active e' normale, visto che non funzionava l'ho tolto! Comunque era esattamente quello che ho postato sopra

Grazie lo stesso comunque

Mich_, poiche' quei link fanno parte del template (cioe' il codice dei link e' "in comune" per tutte le pagine), in pratica se ho capito bene dovrei mettere un placeholder per il valore dell'href, che riempiro' con # per il link appena cliccato, o con il nome della pagina.php da puntare negli altri casi... giusto?
Infatti non sapevo che active funzionasse solo se il mouse si trova sopra al link ed e' cliccato... ora che lo so provero' in altri modi
Grazie! ciao ciao

[Mich_]

In pratica non conta cosa ci metti al posto del link. Puoi anche lasciare il link (e` un po' assurdo un link che punta alla stessa pagina in cui e`).
L'importante e` che per fare quello che vuoi devi inserire una classe (oppure id) specifico, che modifica lo stile di quell'elemento. Di solito si mette lo stile uguale all':hover degli altri elementi della lista, ma statico, che non cambia all':hover.

[ciammarica]

ah, ok credo di aver capito!
Grazie mille, nel weekend faro' le prove
Vi faccio sapere... ciao ciao!