Palabra en enlace

Ekbrilo · #1 (**permalink**) 19/04/2008, 10:40

Buenas, me gustaría saber el código CSS utilizado para sustituir el texto de un enlace por otro cuando el ratón pasa sobre él.

Mikmoro · #2 (**permalink**) 19/04/2008, 12:07

No hay un código específico para hacer eso, pero este es un bonito truco:

Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Cambio texto</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
a {text-decoration: none;}
a span.con {display: none;}
a:hover {background: transparent;}
a:hover span.sin {display: none;}
a:hover span.con {display: block; }
</style>
</head>
<body>
<a href="#"><span class="sin">Sin raton encima</span><span class="con">Con raton encima</span></a>
</body>
</html>

Mikel.

Ekbrilo · #3 (**permalink**) 21/04/2008, 10:44

Gracias, probaré ese truquillo que comentas. Sin embargo, creo recordar que sí existe un código concreto para lograr el efecto de sustitución de texto en el "hover" de un enlace. Lo vi en algún sitio, pero lamentablemente no recuerdo en dónde; por eso pensé que sería algo bastante conocido.

Gracias de nuevo y un saludo

safe · #4 (**permalink**) 21/04/2008, 19:35

supongo que te refieres al atributo "content". Aunque con ese atributo solo puedes agregar texto antes o despues del texto actual (con las pseudo clases :before y :after).
De todos modos ese atributo no es valido para IE6, asi que solo deberias usarlo si sabes que tus usuarios no utilizan ese navegador (o si no te importan tus usuarios!).

Mikmoro · #5 (**permalink**) 22/04/2008, 02:54

Aun así, ese atributo no serviría para "sustituir" el texto del enlace por otro. No creo qu exista tal cosa.

Mikel.