Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Animar capas que contienen flash

Estas en el tema de Animar capas que contienen flash en el foro de Frameworks JS en Foros del Web. Saludos a todos Tengo hecho un carrusel de imagenes que funciona sin problemas, me mueve las fotos deslizandose sin problemas. Sin embargo, si lo que ...
  #1 (permalink)  
Antiguo 23/05/2011, 08:23
 
Fecha de Ingreso: agosto-2004
Mensajes: 312
Antigüedad: 16 años, 2 meses
Puntos: 0
Animar capas que contienen flash

Saludos a todos
Tengo hecho un carrusel de imagenes que funciona sin problemas, me mueve las fotos deslizandose sin problemas.
Sin embargo, si lo que trato de deslizar es una película de flash no hace el efecto de deslizamiento, sino que cambia la posición de la capa sin ningún tipo de animación

Es un carrusell de banners y se supone que se deben poder subir fotos y peliculas flash. Mi pregunta es si es posible animar una capa con jquery que contenga una película flash


Gracias
  #2 (permalink)  
Antiguo 23/05/2011, 09:16
Avatar de Hugo_Euan  
Fecha de Ingreso: abril-2011
Ubicación: Mérida, Yucatán, México
Mensajes: 193
Antigüedad: 9 años, 5 meses
Puntos: 71
Respuesta: Animar capas que contienen flash

Algo así como esto ??

http://www.100pies.com.mx/medicosenred/

el carrusel contiene imagenes normales y un flash, =P
eso es lo que buscas?
__________________
Se acepta Karma (:

Si Dios con nosotros, quien contra nosotros !!
  #3 (permalink)  
Antiguo 23/05/2011, 09:46
 
Fecha de Ingreso: agosto-2004
Mensajes: 312
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Animar capas que contienen flash

Gracias Hugo_euan
Es algo parecido.
La ideas es que se muestra el slider con una serie de elementos, se pare unos segundos y se desplace unos pixels determinados para volver a pararse y continuar de esta manera.
Tengo el slider funcionando correctamente pero cuando le añado una película flash no me hacce la animación.
¿alguna sugerencia de porque motivo lo hace?

Gracias
  #4 (permalink)  
Antiguo 23/05/2011, 09:48
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.135
Antigüedad: 16 años, 4 meses
Puntos: 827
Respuesta: Animar capas que contienen flash

Probá colocándole al swf el atributo wmode en transparent u opaque (el valor por defecto es window).
  #5 (permalink)  
Antiguo 23/05/2011, 10:09
Avatar de Hugo_Euan  
Fecha de Ingreso: abril-2011
Ubicación: Mérida, Yucatán, México
Mensajes: 193
Antigüedad: 9 años, 5 meses
Puntos: 71
Respuesta: Animar capas que contienen flash

bueno tal vez podrias publicar la parte del carrusel para examinarlo y ver si podemos dar con el fallo, de momento, no se me ocurre nada...
__________________
Se acepta Karma (:

Si Dios con nosotros, quien contra nosotros !!
  #6 (permalink)  
Antiguo 24/05/2011, 04:10
 
Fecha de Ingreso: agosto-2004
Mensajes: 312
Antigüedad: 16 años, 2 meses
Puntos: 0
Respuesta: Animar capas que contienen flash

Gracias por la ayuda a todos
Por motivos de plazos tengo que dejar pendiente la cuestión, así que lo voy a limitar a archivos de imagen.
Adjunto el código aunque lo que hice fue sacarlo de un tutorial de jquery
Código Javascript:
Ver original
  1. $(document).ready(function(){
  2.     spacing = 253; //Espacio ancho que ocupan las miniaturas
  3.     minis   = 1; //Numero de miniaturas que aparecen
  4.     dist_esconder = -1000; //donde colocamos la miniatura cuando esta escondida. Puede ser necesario cambiarla
  5.    
  6.     $('#featured').css({
  7.         //'width': spacing * minis,
  8.         'width': '190px',
  9.         'height': '253px',
  10.         'overflow': 'hidden'
  11.     }).find('.covers a').css({
  12.         'position': 'absolute',
  13.         'top': dist_esconder,
  14.         'left': 0
  15.     });
  16.  
  17.     var setUpCovers = function(){
  18.         var $covers = $('#featured .covers a');
  19.        
  20.         for (c = 0; c < minis; c++){
  21.             $covers.eq(c).css('top', spacing * c);
  22.         }
  23.     };
  24.  
  25.     setUpCovers();
  26.    
  27.     repeticion = setTimeout(top, 3000);
  28. });
  29.  
  30. function top(){
  31.     //var spacing = 220;
  32.     var $covers = $('#featured .covers a');
  33.    
  34.     for (c = 0; c < (minis) ; c++){
  35.         $covers.eq(c).animate({'top': spacing * (c + 1)}, 'fast'); 
  36.     }
  37.     $covers.eq($covers.length - 1)
  38.         .css('top', -spacing)
  39.         .animate({'top': 0}, 'fast', function(){
  40.             $(this).prependTo('#featured .covers');
  41.                                                }); 
  42.     clearTimeout(repeticion);
  43.     repeticion = setTimeout(top, 3000);
  44. }

El css de partida es el siguiente
Código CSS:
Ver original
  1. #featured{  position: relative; width: 210px;height: auto; overflow: scroll; margin:0; padding: 5; text-align: center; background-color:#ccccCC }
  2.         #featured .covers{ heigth:auto;}

Y por último el código html
Código HTML:
Ver original
  1. <div id="featured">
  2.                 <div class="covers" onmouseover="clearTimeout(repeticion);" onmouseout="repeticion = setTimeout(left, 3000);">
  3.                     <a href="#"><img src="Forest.jpg" border="0" /></a>
  4.                     <a href="#"><img src="Humpback-Whale.jpg" border="0" /></a>
  5.                     <a href="#"><img src="Tree.jpg" border="0" /></a>                                        
  6.                </div>
  7.              </div>

Cuando en el ancla introduzco un swf en lugar de una imagen no me realiza la animación.

Por tema de cumplir plazos con el cliente lo voy a limitar de momento a imágenes que funciona correctamente, pero no descarto implementarlo más adelante. Puede que tarde en contestar por lo liado que voy

De nuevo gracias a todos por el interés

Etiquetas: javascript, jquery
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




La zona horaria es GMT -6. Ahora son las 09:16.