jueves, 9 de abril de 2009

CAMBIAR COLOR DEL FONDO DE LINK

Este efecto es muy común y consiste en cambiar el color del fondo del link cuando el cursor se encuentra encima del mismo, es un efecto que lo podemos conseguir facilmente gracias a nuestro querido Javascript, podemos insertarlo en nuestro blog de la siguiente forma:

Primer paso:(Copiar Script)

Nos dirijiremos a donde se encuentra nuestro código HTML de nuestra plantilla, en el caso concreto de blogger Diseño->Edición de HTML, una vez aquí copiaremos el siguiente script justamente encima de
</head>
<script>
function highlight(which,color){
if (document.all||document.getElementById)
which.style.backgroundColor=color}
</script>
Segundo paso:(Crear efecto)

Llegado a este punto, lo único que tendréis que hacer para crear el efecto será copiar el siguiente código en el lugar donde queráis que el efecto se aprecie.

<a href="URL DESTINO DEL LINK" onMouseover="highlight(this,'COLOR FONDO LINK')" onMouseout="highlight(this,document.bgColor)">PARTE VISIBLE LINK</a>

El resultado será algo como lo siguiente:(Poner cursor encima de EJEMPLO)

EJEMPLO 1


EJEMPLO 2

Nota: Si lo insertáis en un una entrada, deberéis insertar el código en la parte de Edición de HTML.

Ejemplos de colores: yelow,blue, red ...

Para consultar tabla de colores podéis hacer click aquí.

5 Comentarios:

Josué dijo...

Esta bonito el efecto, pero a mi no me sale bien,
cuando paso el mouse sobre la palabra con enlace aparece el color.

Cuando quito el mouse, esa misma palabra queda con el color del primer fondo de plantilla que es oscuro, y ya con eso esa palabra con enlace no se puede leer.
Como puedo arreglar este inconveniente?
:)
Saludos.

caxitos dijo...

Josue Lo que comentas no es un inconveniente, simplemente debes de elejir los colores adecuados para que se vea bien el link antes y después de situar el cursor encima, como puedes observar en la tabla de colores tienes multitud de colores que podrás combinar con el objetivo de que quede lo mejor posible. Prueba a modificar los colores y ya me cuentas.

Josué dijo...

Muchas Gracia. Tenia mal el código :)
ahora ya funciona :)
ahora veré lo de los comentarios :)
Saludos.

Publicar un comentario en la entrada

Haga su comentario

Bienvenido al Rincon del Blog
Tus comentarios nos ayudan a mejorar
Muchas Gracias por Comentar.