Foros del Web » Programando para Internet » PHP »

[SOLUCIONADO] Error al generar codigo css3 desde PHP

Estas en el tema de Error al generar codigo css3 desde PHP en el foro de PHP en Foros del Web. No entiendo que pasa... tengo una galeria con scross fade en css3, tira bien si el codigo va a pelo. Pero cuando intento generar el ...
  #1 (permalink)  
Antiguo 03/11/2013, 07:56
Avatar de protoameeba  
Fecha de Ingreso: septiembre-2005
Mensajes: 195
Antigüedad: 14 años, 2 meses
Puntos: 3
Pregunta Error al generar codigo css3 desde PHP

No entiendo que pasa...

tengo una galeria con scross fade en css3, tira bien si el codigo va a pelo.

Pero cuando intento generar el codigo para "n" imagenes desde un for PHP, no funciona!!

Alguien sabe porque?

aqui va el codigo PHP:

Código PHP:
Ver original
  1. $total=7;
  2. $animation_seconds=($total*2)-2;
  3. $loopSize=$total-1;
  4. $initAnimation_num=1;
  5. $currentSecond=$animation_seconds;
  6. for($i=0; $i<=$loopSize; $i++)
  7. {
  8.     echo"#mierda img:nth-of-type($initAnimation_num)
  9.     {
  10.     -webkit-animation-delay: $currentSecond;
  11.     -moz-animation-delay: $currentSecond;
  12.     -o-animation-delay: $currentSecond;
  13.     animation-delay: $currentSecond;
  14.     }";
  15.     $initAnimation_num++;
  16.     $currentSecond=$currentSecond-2;
  17. }

Podeis probar, para ver que lo esta escribiendo bien, pero despues el documento no lo lee...

Alguna idea?
__________________
Ser libre no es hacer lo ke uno kiere, sino kerer lo ke uno hace....
  #2 (permalink)  
Antiguo 03/11/2013, 08:39
Avatar de pateketrueke
Modernizr
 
Fecha de Ingreso: abril-2008
Ubicación: Mexihco-Tenochtitlan
Mensajes: 26.399
Antigüedad: 11 años, 7 meses
Puntos: 2534
Respuesta: Error al generar codigo css3 desde PHP

Lo mejor sería que muestres el código CSS ya generado, porque todo apunta a que tu problema es de CSS pues de PHP no existe error alguno.

En dado caso lo correcto sería mostrar dichos resultados y tal vez, sólo tal vez, indagar en el foro correcto.
__________________
Y U NO RTFM? щ(ºдºщ)

No atiendo por MP nada que no sea personal.
  #3 (permalink)  
Antiguo 03/11/2013, 08:55
Avatar de protoameeba  
Fecha de Ingreso: septiembre-2005
Mensajes: 195
Antigüedad: 14 años, 2 meses
Puntos: 3
Respuesta: Error al generar codigo css3 desde PHP

Hola pateketrueke gracias por responder amigo...acabo de encontrar el problema... me comi la "s" de segundos al sustituir el nuemro por la variable!!!

dia espesillo y tal...sorry!

de todas maneras efectivamente aqui dejo el codigo, resulta que he optado por hacer la galeria con cross fade de css3 por que al recargarla por ajax en un div y jquery me provocaba colision de jquery y el no conflict no funcionaba para este caso porque dentro del documento habia muchos includes...

Código HTML:
Ver original
  1. <style type="text/css" media="all">
  2. @-webkit-keyframes FadeInOut {
  3.  0% {
  4.    opacity:1;
  5.  }
  6.  17% {
  7.    opacity:1;
  8.  }
  9.  25% {
  10.    opacity:0;
  11.  }
  12.  92% {
  13.    opacity:0;
  14.  }
  15.  100% {
  16.    opacity:1;
  17.  }
  18. }
  19.  
  20. @-moz-keyframes FadeInOut {
  21.  0% {
  22.    opacity:1;
  23.  }
  24.  17% {
  25.    opacity:1;
  26.  }
  27.  25% {
  28.    opacity:0;
  29.  }
  30.  92% {
  31.    opacity:0;
  32.  }
  33.  100% {
  34.    opacity:1;
  35.  }
  36. }
  37.  
  38. @-o-keyframes FadeInOut {
  39.  0% {
  40.    opacity:1;
  41.  }
  42.  17% {
  43.    opacity:1;
  44.  }
  45.  25% {
  46.    opacity:0;
  47.  }
  48.  92% {
  49.    opacity:0;
  50.  }
  51.  100% {
  52.    opacity:1;
  53.  }
  54. }
  55.  
  56. @keyframes FadeInOut {
  57.  0% {
  58.    opacity:1;
  59.  }
  60.  17% {
  61.    opacity:1;
  62.  }
  63.  25% {
  64.    opacity:0;
  65.  }
  66.  92% {
  67.    opacity:0;
  68.  }
  69.  100% {
  70.    opacity:1;
  71.  }
  72. }
  73.  
  74. #mierda {
  75.   position:relative;
  76.   height:281px;
  77.   width:450px;
  78.   margin:0 auto;
  79. }
  80. #mierda img {
  81.   position:absolute;
  82.   left:0;
  83. }
  84.  
  85. #mierda img {
  86.   -webkit-animation-name: FadeInOut;
  87.   -webkit-animation-timing-function: ease-in-out;
  88.   -webkit-animation-iteration-count: infinite;
  89.   -webkit-animation-duration: 8s;
  90.  
  91.   -moz-animation-name: FadeInOut;
  92.   -moz-animation-timing-function: ease-in-out;
  93.   -moz-animation-iteration-count: infinite;
  94.   -moz-animation-duration: 8s;
  95.  
  96.   -o-animation-name: FadeInOut;
  97.   -o-animation-timing-function: ease-in-out;
  98.   -o-animation-iteration-count: infinite;
  99.   -o-animation-duration: 8s;
  100.  
  101.   animation-name: FadeInOut;
  102.   animation-timing-function: ease-in-out;
  103.   animation-iteration-count: infinite;
  104.   animation-duration: 8s;
  105. }
  106. #mierda img:nth-of-type(1) {
  107.   -webkit-animation-delay: 6s;
  108.   -moz-animation-delay: 6s;
  109.   -o-animation-delay: 6s;
  110.   animation-delay: 6s;
  111. }
  112. #mierda img:nth-of-type(2) {
  113.   -webkit-animation-delay: 4s;
  114.   -moz-animation-delay: 4s;
  115.   -o-animation-delay: 4s;
  116.   animation-delay: 4s;
  117. }
  118. #mierda img:nth-of-type(3) {
  119.   -webkit-animation-delay: 2s;
  120.   -moz-animation-delay: 2s;
  121.   -o-animation-delay: 2s;
  122.   animation-delay: 2s;
  123. }
  124. #mierda img:nth-of-type(4) {
  125.   -webkit-animation-delay: 0;
  126.   -moz-animation-delay: 0;
  127.   -o-animation-delay: 0;
  128.   animation-delay: 0;
  129. }
  130. <div id="mierda" class="shadow">
  131.   <img src="img/main_banner_pelukas.jpg"/>
  132.   <img src="img/main_banner_miss_van.jpg"/>
  133.   <img src="img/main_banner_bansky.jpg"/>
  134.   <img src="img/main_banner.jpg"/>
  135. </div>
__________________
Ser libre no es hacer lo ke uno kiere, sino kerer lo ke uno hace....

Etiquetas: css3
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 05:19.