Foros del Web » Creando para Internet » HTML »

Links que cambien de color o texto al pasar mouse

Estas en el tema de Links que cambien de color o texto al pasar mouse en el foro de HTML en Foros del Web. Hola a todos: Necesito que alguien me ayude con CSS, estoy entrando en materia y llevo mas de 5 días descubriendolo por mí cuenta, pero ...
  #1 (permalink)  
Antiguo 12/09/2002, 09:27
Avatar de Fr@Nc3$c0  
Fecha de Ingreso: abril-2002
Ubicación: Barcelona (Spain)
Mensajes: 710
Antigüedad: 15 años, 8 meses
Puntos: 1
Links que cambien de color o texto al pasar mouse

Hola a todos:

Necesito que alguien me ayude con CSS, estoy entrando en materia y llevo mas de 5 días descubriendolo por mí cuenta, pero no llego a lo que quiero.

Quiero que al pasar el mouse por el link, el texto cambie de color o la letra se haga más grande.

Creo que tiene que ver algo con la etiqueta onMouseOver="xXx"
pero no se llevar a cabo lo que quiero.

Agradezco muxo por adelantado vuestra cooperación!.








<Marquee>[email protected]$c0</marquee>
  #2 (permalink)  
Antiguo 12/09/2002, 09:43
Avatar de Cain  
Fecha de Ingreso: enero-2002
Ubicación: Catalunya
Mensajes: 6.459
Antigüedad: 15 años, 11 meses
Puntos: 17
Re: Links que cambien de color o texto al pasar mouse

Haces dos clases, por ejemplo
span.normal{font-color: red; font-size: 10;}
span.arriba{font-color: blue; font-size: 12; font-weight: bold;}

Y luego lo llamas así:
&lt;span class=&quot;normal&quot; onMouseOver=&quot;Javascript:this.className=arriba ;&quot;&gt;Mira como crezco y cambio de color&lt;/span&gt;

<div style="font:x-small Verdana;">Proximamente...</div>
<div align="center" style="font:bold x-small Verdana;"><a style="text-decoration:none;" href="http://www.traduim.com" target="_blank">Traduim</a>: El portal de los traductores</div>
  #3 (permalink)  
Antiguo 12/09/2002, 14:57
Avatar de Fr@Nc3$c0  
Fecha de Ingreso: abril-2002
Ubicación: Barcelona (Spain)
Mensajes: 710
Antigüedad: 15 años, 8 meses
Puntos: 1
Re: Links que cambien de color o texto al pasar mouse

gracias compañero!, hay alguna otra manera? evitando KavaScript? es por saber
  #4 (permalink)  
Antiguo 12/09/2002, 16:05
Avatar de Fr@Nc3$c0  
Fecha de Ingreso: abril-2002
Ubicación: Barcelona (Spain)
Mensajes: 710
Antigüedad: 15 años, 8 meses
Puntos: 1
Re: Links que cambien de color o texto al pasar mouse

NO FUNCIONA ESTO, PORFAVOR MAS AYUDA




<Marquee>[email protected]$c0</marquee>
  #5 (permalink)  
Antiguo 12/09/2002, 16:15
Avatar de Cain  
Fecha de Ingreso: enero-2002
Ubicación: Catalunya
Mensajes: 6.459
Antigüedad: 15 años, 11 meses
Puntos: 17
Re: Links que cambien de color o texto al pasar mouse

si se trata de links...
&lt;style&gt;
a: {font-color:red; font-familiy:Arial;}
a:hover: {font-color:blue; font-familiy:Arial; font-size:12;}
&lt;/style&gt;

<div style="font:x-small Verdana;">Se está acercando...</div>
<div align="center" style="font:bold x-small Verdana;"><a style="text-decoration:none;" href="http://www.traduim.com" target="_blank">Traduim</a>: El portal de los traductores</div>
  #6 (permalink)  
Antiguo 12/09/2002, 16:18
Avatar de ocionet  
Fecha de Ingreso: agosto-2002
Ubicación: Costa Brava, Catalunya
Mensajes: 605
Antigüedad: 15 años, 3 meses
Puntos: 0
Re: Links que cambien de color o texto al pasar mouse

Hola coloca entre las etiquetas &lt;head&gt; y &lt;/head&gt; el siguiente codigo.

Código:
 

&lt;STYLE&gt;
A:link {
	TEXT-DECORATION: none
}

A:visited {
	TEXT-DECORATION: none
}

A:hover {color: #FF0000}

&lt;/style&gt;
Como podrás comprobar, se reprensentan los tres estados del link. El primero hace referencia el link normal, el segundo a un link ya visitado y el ttercero es cunado tienes el ratón encima.

Luego entre los {} colocas en css el formato que quieras. En este ejemplo al poner el ratón encima del link este se vuelve de color rojo.

Solo debes poner este codigo y ya lo heredaran todos los links de un documento.

Si te queda alguna duda, aqui estoy.




Webmaster de: <br>
<a HREF="http://leeyescribe.com" target="_blank"> http://www.leeyescribe.com </a><br>
<a HREF="http://www.mundowebcam.es.org" target="_blank"> http://www.mundowebcam.es.org</a>
  #7 (permalink)  
Antiguo 12/09/2002, 16:36
Avatar de ocionet  
Fecha de Ingreso: agosto-2002
Ubicación: Costa Brava, Catalunya
Mensajes: 605
Antigüedad: 15 años, 3 meses
Puntos: 0
Re: Links que cambien de color o texto al pasar mouse

ui, cain se me avanzo unos minutos, he he.

Bueno espero que ahora no, lo que te decia Cain anteriormente q lo hacía con javascript creo que en vez de hacer con classes si lo hicieras con una id por cada link funcionaria.

ejemplo:

&lt;a href=&quot;http://miweb.com&quot; id=&quot;link1&quot; onMouseover=&quot;dentro('link1')&quot; onMouseout=&quot;fuera('link1')&quot;&gt; link &lt;/a&gt;

&lt;script&gt;

function dentro(id) {

document.getElementById(id).style.color = &quot;#FF0000&quot;;


}


function fuera(id) {

document.getElementById(id).style.color = &quot;#000000&quot;;


}


&lt;/script&gt;


En este ejemplo solo cambia el color, igual que al anterior, pero también lo puedes configurar para que cambie más propiedades.

De esta manera va mejor si solo quieres aplicar este efecto a un link, o bien si a cada link quieres aplicarle efectos diferentes, pero si lo quieres poara toda la pagina es mejor el otro ejemplo.

He comprobado su funcionamiento con lo que no deberia tener ningun incoveniente.



Webmaster de: <br>
<a HREF="http://leeyescribe.com" target="_blank"> http://www.leeyescribe.com </a><br>
<a HREF="http://www.mundowebcam.es.org" target="_blank"> http://www.mundowebcam.es.org</a>
  #8 (permalink)  
Antiguo 13/09/2002, 09:29
Avatar de Fr@Nc3$c0  
Fecha de Ingreso: abril-2002
Ubicación: Barcelona (Spain)
Mensajes: 710
Antigüedad: 15 años, 8 meses
Puntos: 1
Re: Links que cambien de color o texto al pasar mouse

GRACIAS A TODOS CHICOS
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 21:42.