Foros del Web » Programando para Internet » Javascript »

Efecto Fade on y out

Estas en el tema de Efecto Fade on y out en el foro de Javascript en Foros del Web. Hola, Estoy haciendo un efecto consistente en iconos que, al pasar en hover muestran una imagen mayor a la derecha. Es una galería de arte. ...
  #1 (permalink)  
Antiguo 25/04/2011, 06:54
 
Fecha de Ingreso: noviembre-2005
Mensajes: 889
Antigüedad: 18 años, 6 meses
Puntos: 8
Efecto Fade on y out

Hola,

Estoy haciendo un efecto consistente en iconos que, al pasar en hover muestran una imagen mayor a la derecha.

Es una galería de arte.

Se trata de hacerlo con css y ya lo he conseguido en cuanto a la colocación y el despliegue de las imágenes sin ninguna dificultad.

El problema viene cuando se trata de que las imágenes en hover aparezcan (a la derecha) en un efecto de fade al aparecer y al quitar.

Sé que no es posible con css, y he oído algo de que se puede con JavaScript. Aunque tampoco voy a decir cómo, porque no tengo la certeza y me gustaría preguntar si es posible unir los dos efectos al pasar el hover, y dónde podría encontrar un código estándar para este tipo de proyectos.

Un saludo y gracias por vuestra ayuda.
  #2 (permalink)  
Antiguo 25/04/2011, 08:41
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Efecto Fade on y out

has usar jquery
  #3 (permalink)  
Antiguo 25/04/2011, 20:27
Avatar de Perr0  
Fecha de Ingreso: mayo-2005
Ubicación: Santiago de Chile, Chile
Mensajes: 676
Antigüedad: 19 años
Puntos: 79
Respuesta: Efecto Fade on y out

acá encontre otro ejemplo sin jquery, pero tienes que cargar una libreria

http://www.javascript-fx.com/fade_ro...help/help.html

te servira para entenderlo.

a mi impresión para realizar este efecto necesitas:
- onmuseover
- onmouseout
- setTimeout
- para el elemento si NO ES IE elemento.style.opacity=20/100 caso contrario elemento style.filter = 'alpha(opacity=' + 20 + ')' (un ejemplo de un 20% de alpha)
- clearTimeout
- las imágenes (obvio)

puede que falte o sobre algo pero con ello podrás hacer tu fade in y out.

salu2
__________________
Numerador Mp3 en Access =)
http://www.mediafire.com/download/r9...pdw/mp3(2).zip

Última edición por Perr0; 25/04/2011 a las 20:41
  #4 (permalink)  
Antiguo 26/04/2011, 07:17
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Efecto Fade on y out

Cita:
Iniciado por Perr0 Ver Mensaje
acá encontre otro ejemplo sin jquery, pero tienes que cargar una libreria
que extraño se me hace recomendar una librería que sólo usarán un puñado de personas en todo el mundo y que por lo que he visto únicamente sirve para hacer ese efecto, en contra posición de jquery
  #5 (permalink)  
Antiguo 26/04/2011, 07:33
Avatar de Perr0  
Fecha de Ingreso: mayo-2005
Ubicación: Santiago de Chile, Chile
Mensajes: 676
Antigüedad: 19 años
Puntos: 79
Respuesta: Efecto Fade on y out

Cita:
Iniciado por IsaBelM Ver Mensaje
que extraño se me hace recomendar una librería que sólo usarán un puñado de personas en todo el mundo y que por lo que he visto únicamente sirve para hacer ese efecto, en contra posición de jquery

no entiendo nada de jquery ni su sintaxis, me puse en el caso que tampoco quiera algo con jquery.

salu2
__________________
Numerador Mp3 en Access =)
http://www.mediafire.com/download/r9...pdw/mp3(2).zip
  #6 (permalink)  
Antiguo 26/04/2011, 08:03
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Efecto Fade on y out

Cita:
Iniciado por Perr0 Ver Mensaje
no entiendo nada de jquery ni su sintaxis, me puse en el caso que tampoco quiera algo con jquery.

salu2
  #7 (permalink)  
Antiguo 02/05/2011, 03:01
 
Fecha de Ingreso: noviembre-2005
Mensajes: 889
Antigüedad: 18 años, 6 meses
Puntos: 8
Respuesta: Efecto Fade on y out

Ya he solucionado el problema con galleriffic.

Etiquetas: efecto, fade
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 18:00.