Avisos
Vaciar todo

Hacer que las imágenes cambien de color cuando se pasa el ratón por encima  

 
Dani
 Dani
Estimable Member

Hola,

Me gustaría que en unas imágenes apareciese un texto, o bien otra imagen cuando el mouse para sobre ellas, he visto alguna explicación por el foro con el tipo de codigo que hace falta, pero me quedan duda a la hora de configurarlo, alguien me puede explicar como podría hacer esto que quiero?

Gracias de antemano por el trabajo que realizais,

Un saludo

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 24/10/2015 7:31 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Si quieres cambiar de color una imagen, lo que se suele usar actualmente es usar iconos como tipo de letra o fuente, de manera que sea sencillo el cambio de color por CSS

Tendrías que darnos más detalles, algún ejemplo de la imagen con la que quieres trabajar por ejemplo ayudaría y podríamos descartar si puede ser por tipo de letra o por otro método

Saludos.

ResponderCitar
Respondido : 24/10/2015 8:15 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

Dani
 Dani
Estimable Member

Hola,

Disculpe, no me he explicado bien, ahora adjunto unas capturas de pantalla con el efecto que me gustaría conseguir.

Sería una imagen cualquiera, y lo que me gustaría es que una vez que pase el mouse sobre la imagen, se viese un texto u animación. Como por ejemplo ocurre en youtube, pasas el mouse por la miniatura del video y aparece una descripción del mismo.

Puede ver los datos adjuntos para que pueda ver como me gustaría que fuese el antes y el después de las imagenes

Gracias

Un saludo

ResponderCitar
Respondido : 24/10/2015 8:37 pm
Luis Mendez Alejo
 Luis Mendez Alejo
Miembro Moderator

Hola Antonio,

Eso se llama 'imagen de sustitución' que se muestra bajo un evento 'onmouse' y que tiene que permitirlo tu Tema en uso y naturalmente algún addon (JetPack) o plugin que instales para hacer posible esto mismo.

Por ejemplo https://wordpress.org/plugins/img-mouseover/ si bien que este plugin hace 2 años que no se actualiza y no seria recomendable.

Revisa también este enlace (demo) por si es lo que buscas: http://wpvisualslideboxbuilder.com/

También lo puedes hacer manualmente en cada post donde quieres mostrar una imagen y que al pasar el ratón se visualice otra por ejemplo:

Imagen de sustitución

Saludos

ResponderCitar
Respondido : 25/10/2015 1:57 am

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Dani
 Dani
Estimable Member

Hola,

He intentado hacerlo de manera manual, pero hay algo que hago mal y no se porque, podrían por favor echarme una mano en esto?

este es el codigo que he puesto en mi página:
src=""
alt="Imagen de sustitución" width="836" height="296"
oversrc="" />

Pero no funciona, se me ven ambas imágenes,
Qué podría hacer?

Gracias por su trabajo.

Un saludo

ResponderCitar
Respondido : 25/10/2015 10:24 am
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

El código que has puesto esta mal

Prueba con esto y sólo cambia las imágenes


Pasa el ratón para cambiar la imagen

Saludos.

ResponderCitar
Respondido : 25/10/2015 3:30 pm