Autor Tema: Ayuda Con "Fade in" y fade" Out"  (Leído 853 veces)

Desconectado SoyJoaquin.

  • PHPero Master
  • ******
  • Mensajes: 2.737
  • Karma: 131
  • Sexo: Masculino
  • ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ Problem?
    • Ver Perfil
    • IsoMap
Ayuda Con "Fade in" y fade" Out"
« en: 19 de Abril de 2010, 03:26:52 am »
Aver...
En javascrip no se mucho pero...
Quisiera hacer un fade in y fade Out automáticamente al presionar una imagen...

Aver me explico...
Al presionar una "x" imagen.. Se haga el efecto "Fade In" en una tabla, Luego de pasar un tiempo... (Puede ser 10 segundos) Esta efectue el "Fade Out" para quedar de nuevo invisible...

Al iniciar la tabla odviamente la deseo invisible.. xD

¿Que mas o menos tengo que hacer para esto? :S
Twitter: @JoakoM010



Comunidad PHPeros

Ayuda Con "Fade in" y fade" Out"
« en: 19 de Abril de 2010, 03:26:52 am »

Desconectado Warlox

  • Moderadores PHP
  • PHPero Master
  • ****
  • Mensajes: 1.278
  • Karma: 77
  • Sexo: Masculino
  • A veces hay que aprender a correr antes de caminar
    • Ver Perfil
    • Página personal
Re:Ayuda Con "Fade in" y fade" Out"
« Respuesta #1 en: 19 de Abril de 2010, 06:47:55 am »
No se hace precisamente con JavaScript, usa jQuery ;)
- Moderador de PHP


Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Ayuda Con "Fade in" y fade" Out"
« Respuesta #2 en: 19 de Abril de 2010, 16:35:20 pm »
No se hace precisamente con JavaScript, usa jQuery ;)
Y jQuery que es? PHP?...

Te recomiendo usar jQuery, en realidad para todo...
Porque incorpora selectores CSS3 que hacen todo más facil, como acceder a un elemento por ID $('#LAID'), por nombre: $('.NAME') o por un montón de cosas $('.mi_tabla tr td:first_child')

Para el fadeIn/Out en concreto es:
$('#LAID').fadeIn('fast');
Puedes poner fast, normal, slow o especificar en milisegundos

Desconectado SoyJoaquin.

  • PHPero Master
  • ******
  • Mensajes: 2.737
  • Karma: 131
  • Sexo: Masculino
  • ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ส้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้้ Problem?
    • Ver Perfil
    • IsoMap
Re:Ayuda Con "Fade in" y fade" Out"
« Respuesta #3 en: 19 de Abril de 2010, 19:25:15 pm »
Y jQuery que es? PHP?...

Te recomiendo usar jQuery, en realidad para todo...
Porque incorpora selectores CSS3 que hacen todo más facil, como acceder a un elemento por ID $('#LAID'), por nombre: $('.NAME') o por un montón de cosas $('.mi_tabla tr td:first_child')

Para el fadeIn/Out en concreto es:
$('#LAID').fadeIn('fast');
Puedes poner fast, normal, slow o especificar en milisegundos

Por fin alguien que responde algo coherente.
Pues.. Ando comenzando con JavaScript y de JQuery no se nada.. xD

Me podrías explicar un poco el "$('#LAID').fadeIn('fast');"
Lo de medium, fast, slow me imagino por obvias razones que es el tiempo en aparecer/desaparecer.

Saludos y Gracias.
Twitter: @JoakoM010



Desconectado westwest

  • PHPero Master
  • ******
  • Mensajes: 2.837
  • Karma: 104
  • Sexo: Masculino
    • Ver Perfil
Re:Ayuda Con "Fade in" y fade" Out"
« Respuesta #4 en: 19 de Abril de 2010, 19:34:55 pm »
Por fin alguien que responde algo coherente.
Pues.. Ando comenzando con JavaScript y de JQuery no se nada.. xD

Me podrías explicar un poco el "$('#LAID').fadeIn('fast');"
Lo de medium, fast, slow me imagino por obvias razones que es el tiempo en aparecer/desaparecer.

Saludos y Gracias.

Puedes consultar jQuery.com, que lo explican perfectamente, pero te explicaré por encima.

Los frameworks para JS suelen utilizar la función "$" como sustituto de document.getElementById, lo que sería así:
Código: [Seleccionar]
function $(id) { return document.getElementById(id); }
<!------------>
var midiv = document.getElementById('midiv');
<!--Es igual a-->
var midiv = $('midiv');

jQuery no se queda ahí, la función "$" permite acceder a cualquier elemento, devolviendo el objeto...

Si sabes CSS sabrás que
[code]
#algo { // actúa sobre un elemento con id algo
.algo { // actúa sobre los elementos con class algo
div { // actúa sobre los elementos tipo div
#midiv table:first_child // actúa sobre el primer elemento hijo de las tablas del div #midiv
jQuery permite usar eso para "acceder" a los elementos, así

$('#midiv').fadeIn('fast'); haría un fadeIn a el div con id midiv
$('.midiv').fadeIn('fast'); haría un fadeIn a los elementos de clase midiv

Etcetera...

No se si quedó muy claro :P