[CSS] Nascondere testo email

**zephyr** · 15-10-2007, 09:07

Ciao a tutti,

io invio mail in formato HTML con la mia applicazione.
Tabelle, Colori, liste numerate e puntate, ... nessun problema ma adesso voglio fare in modo che un determinato testo venga visualizzato solamente se ci si passa sopra con il mouse.
Praticamente quello che avviene via javascript sugli eventi onMouseOver e OnMouseOut lo vorrei fare solamente via CSS.

Infatti il client non mi riconosce il javascript o me lo blocca (sono indeciso fra le due cmq non funziona).

Sono arrivato a mettere in piedi una soluzione che funziona egregiamente con Microsoft Outlook e Outlook Express ma non con altri client come Thunderbird o The Bat.

La soluzione è questa:

codice:

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>prova fdsfsdg dfsgsdfhgd hgfdhgf</title>
</head>

<body>
<style>

.link1{
font-size:12px;
font-weight:bold;
color:#ff0000;
overflow:hidden;
height:18px;
text-decoration:none;
}

.link1:hover {
 font-size:12px;
 font-weight:bold;
 color:#339900;
 overflow:visible;
 text-decoration:none;
}

.link1 span{
font-size:12px;
font-weight:normal;
color:#000000;
text-decoration:none;
}


</style>
<table border="0" width="100%" cellpadding="4" cellspacing="0">
	<tr>
		<td>Testo testo testo testo testo testo testo testo testo</td>
	</tr>
	<tr>
		<td>
			
			<a href="#" class="link1">prova

			<span>			
			fdsfsdg dfsgsdfhgd hgfdhgfh hsh

			fdsfsdg dfsgsdfhgd hgfdhgfh hsh

			fdsfsdg dfsgsdfhgd hgfdhgfh hsh

			fdsfsdg dfsgsdfhgd hgfdhgfh hsh

			fdsfsdg dfsgsdfhgd hgfdhgfh hsh

			fdsfsdg dfsgsdfhgd hgfdhgfh hsh

			</span>
			</a>
			
		</td>
	</tr>
</table>

</body>

</html>

Da tutto ciò, potete aiutarmi?
Il testo in questione è puramente per gli addetti ai lavori, di conseguenza non dev'essere sempre visibile altrimenti la mail sarebbe molto lunga da scorrere e non mi piace tanto.

Grazie.

**oronze** · 15-10-2007, 09:14

tu vuoi che il link sia sempre visibile e che il contenuto sottostante a seconda se il link viene cliccato o meno....puoi usare un trucchetto che imposti l'altezza del div...metti height:altezza che visualizza una riga di testo e poi all'hover height:100%....non ho idea se funzioni...è una soluzione un po' contadina

**ricman** · 15-10-2007, 09:15

Nel link devi attribuire "display:none" e all'hover poi le renderai di nuovo visibile.
A che ti serve quell'overflow?

**zephyr** · 15-10-2007, 09:27

Dunque:

- soluzione con display: l'ho provata ma non mi funziona come l'overflow e poi con il display per cambiarlo devo andarci via javascript che io non posso usare.
- soluzione con height: non l'ho ben capita perchè mi sembra già di farlo. Nella classe link1 ho già una height di 18 che poi sparisce nell'hover. Era questo che intendevi Oronze?

Accetto altri help.

Grazie.

**ricman** · 15-10-2007, 10:25

Originariamente inviato da zephyr
- soluzione con display: l'ho provata ma non mi funziona come l'overflow

Ma la conosci la differenza tra i due? No, perchè hanno funzioni diverse che non c'entrano l'uno con l'altro...

Originariamente inviato da zephyr
e poi con il display per cambiarlo devo andarci via javascript che io non posso usare.

Mah... Javascript? Perchè?

Fai una cosa... leggiti: questo e questo e questo

**zephyr** · 15-10-2007, 10:40

Certo che la differenza la conosco infatti li avevo provati ma il loro comportamento non mi piaceva mentre con l'overflow ho il comportamento che volevo.
Però non mi funziona con certi client quindi se questa è la strada che mi consigli sarò obbligato ad intraprenderla ma magari qualcun'altro può darmi altre dritte.

Grazie mille.

**oronze** · 15-10-2007, 10:41

penso che lui voglia visualizzare il link e se ci passa far visualizzare un altro div...se lui lo mette hidden poi come lo visualizza?

è un po' strana come cosa che vuole fare

**zephyr** · 15-10-2007, 11:36

Perfetto: hai perfettamente capito cosa voglio fare.
Infatti utilizzando i visibility o display non riesco a mostrare il link o c'è tutto o non c'è nulla e poi funziona al contrario ho visto adesso riprovando quella strada quindi li lascio.

Quindi mi sà che passerò ad altra soluzione magari metto tutto in una tabella e me la smazzo così senza il giochino che mi piacerebbe fare.

Oronze: hai altre idee visto che hai afferrato il problema perfettamente?

**ricman** · 15-10-2007, 12:21

Originariamente inviato da oronze
penso che lui voglia visualizzare il link e se ci passa far visualizzare un altro div...se lui lo mette hidden poi come lo visualizza?

Ahhhhhhhhhh.... avevo capito male...
Ma continuo a non capire come possa pensare che l'overflow "gli piace come soluzione".
Si... io allora lo farei in js... come sicuramente consigliano molte delle guide online.

Però ragazzi... stiamo parlando di una email!!
Metti un link che apre una pagina web esterna... è molto più semplice...

**oronze** · 15-10-2007, 18:21

effettivamente sì...ma hai provato la mia soluzione molto spartana?
x= quanto occupa una riga di testo in px
y= quanto occupa l'intero testo
.link1{
height:x;
}

.link1:hover {
height:y;
}
non funziona?

Discussione: [CSS] Nascondere testo email

Strumenti discussione

Ricerca discussione

Visualizza

[CSS] Nascondere testo email

Permessi di invio