Css - Efecto roll over de imagen en campo de texto
Códigos Css
Este script consigue en un campo de texto cambie la imagen de fondo al pasar el mouse por encima.
Tutores.org
Mostrando Codigo - Css
EXPLICACION
Debemos modificar las 2 urls que apuntan hacia las imagenes, ademas de color: para especificar el color de la fuente o letras.
Al insertar imagenes transparentes el fondo del area de texto aparecerá en negro, como aparece en el ejemplo, por lo que no recomendamos insertar imagenes transparentes
CODIGO
/* Codigo ofrecido por Tutores.org */
- <head>
- <style>
- textarea.imagen1{
- background-color:000000;
- background-image:url(/images/mundo.gif);
- color:00ff00;
- }
- textarea.imagen2{
- background-color:000000;
- background-image:url(/images/mundo2.gif);
- color:ff0000;
- }
- </style>
- </head>
- <textarea
- rows="10" cols="60"
- class="imagen1"
- onMouseOver="this.className='imagen2'"
- onMouseOut="this.className='imagen1'"></textarea>
ENLACE AL CODIGO
Si quieres enlazar desde tu pagina a este codigo<!-- Inicio enlace Tutores.org -->
<a title="Tutores.org - Efecto roll over de imagen en campo de texto " href="http://www.tutores.org/codigo/674/" target="_blank">Efecto roll over de imagen en campo de texto </a>
<!-- Final enlace Tutores.org -->
<a title="Tutores.org - Efecto roll over de imagen en campo de texto " href="http://www.tutores.org/codigo/674/" target="_blank">Efecto roll over de imagen en campo de texto </a>
<!-- Final enlace Tutores.org -->
COMENTARIOS