delay en función de mootools

[hectoralvaez]

Buenos días,

no se si es el sitio adecuado para comentar lo siguiente, pero tengo un problema con mootools, ya que realizo un efecto alpha de 0 a 100 pero me gustaría hacer un delay antes de cargar el siguiente efecto, ya que son frases y tiene que dar tiempo a llerlo.

el código es el siguiente:

Código Javascript:

window.addEvent('domready',function() {
var miEfecto1 = new Fx.Style('texto28' ,'opacity',{duration: 15000,onComplete: function(){miEfecto2.start(1,0);}});
var miEfecto2 = new Fx.Style('texto41' ,'opacity',{duration: 15000,onComplete: function(){miEfecto3.start(1,0);}});
var miEfecto3 = new Fx.Style('texto27' ,'opacity',{duration: 15000,onComplete: function(){miEfecto4.start(1,0);}});
...etc...
var miEfecto49 = new Fx.Style('texto17' ,'opacity',{duration: 15000,onComplete: function(){miEfecto50.start(1,0);}});
var miEfecto50 = new Fx.Style('texto28' ,'opacity',{duration: 15000,onComplete: function(){miEfecto51.start(1,0);}});
*
*
miEfecto1.start(1,0);});
 

espero que alguien pueda ayudarme.

muchísimas gracias

[KoswiDigital]

Hola, igual lo que estás buscando es un setInterval() para dejar unos segundos entre cada efecto.


Un saludo.

[hectoralvaez]

buenos días KoswiDigital.

si, podría servir, pero es que no sé dónde tendría que ir:

Código Javascript:

var miEfecto50 = new Fx.Style('texto28' ,'opacity',{duration: 15000,onComplete: function(){miEfecto51.start(1,0);}});
 

voy un poco perdido, muchas gracias!

[KoswiDigital]

Prueba así a ver...

Código Javascript:

var miEfecto50 = new Fx.Style('texto28' ,'opacity',{duration: 15000,onComplete: function(){ setInterval( miEfecto51.start(1,0) , 5000 );}});
 

Más info de setInterval();

[hectoralvaez]

Muchas gracias KoswiDigital, pero sigue sin funcionar :(

te pongo el codigo fuente original para ver si crees que puede haber otro error. Estoy trabajando con joomla y esto es un mod_custom, lo carga todo bien, menos el tiempo que quedan las frases al 100% de alpha

--------------------------------------------------------------
<div class="content_efecte">
<div class="efecte">
<?php $result = mysql_query("SELECT * FROM jos_alpha_quotation");
$num_rows = mysql_num_rows($result);
while($row = mysql_fetch_array($result)){
echo "<p id='texto".$row['id']."' style='opacity : 0; visibility : hidden;'>".$row['quotation']."<br />";
echo "<span>".$row['source']."</span>";
echo "</p> ";
}
?>

<img name="comillas" id="comillas" src="/sala/templates/salaimartin/images/comillas-<?php if($_COOKIE['num_color']==NULL) echo rand(1,8);else echo $_COOKIE['num_color']?>.png" />
</div>
</div>

<script type="text/javascript">
<?php
echo "\n";
$i=1;
while($i <= $num_rows)
{
echo "var miEfecto".$i." = new Fx.Style('texto".rand(1, $num_rows )."' ,'opacity',{duration: 9000,onComplete: function(){setInterval(miEfecto".($i+1).".start(1, 0) , 15000 );}});\n";
$i++;
}
?>
window.addEvent('domready',function() {
miEfecto1.start(1,0);});
</script>
--------------------------------------------------------------

muchas gracias por tu ayuda!!

[KoswiDigital]

A ver si podemos implementarlo de otra manera...

Código Javascript:

function dale(i)
{
  miEfecto+i.start(1,0)
}
 

Código PHP:

<?php
echo "\n";
$i=1;
while($i <= $num_rows)
{
echo "var miEfecto".$i." = new Fx.Style('texto".rand(1, $num_rows )."' ,'opacity',{duration: 9000,onComplete: function(){setInterval(dale(".($i+1).") , 15000 );}});\n";
$i++;
}
?>
 

A ver si así solucionamos. Nos creamos una función "de arranque" y que el setInterval la llame por cada vez que se ejecute, seleccionando el número adecuado recogido con php. Es un invento... Tú prueba ^^

Un saludo.

[hectoralvaez]

Muchas gracias por tu ayuda KoswiDigital pero no acaba de funcionar.

Lo más cerca que estoy ahora de encotrar la solución es esto:

Código Javascript:

window.addEvent('domready',function() {
var miEfecto_i1 = new Fx.Style('texto17' ,'opacity',{duration: 1000,onComplete: function(){miEfecto_o1.start(1,0);}});
var miEfecto_o1 = new Fx.Style('texto17' ,'opacity',{duration: 10000,onComplete: function(){setInterval(miEfecto_i2.start(0,1) , 15000 );}});
var miEfecto_i2 = new Fx.Style('texto11' ,'opacity',{duration: 1000,onComplete: function(){miEfecto_o2.start(1,0);}});
var miEfecto_o2 = new Fx.Style('texto11' ,'opacity',{duration: 10000,onComplete: function(){setInterval(miEfecto_i3.start(0,1) , 15000 );}});
 
........
var miEfecto_i60 = new Fx.Style('texto42' ,'opacity',{duration: 1000,onComplete: function(){miEfecto_o60.start(1,0);}});
var miEfecto_o60 = new Fx.Style('texto42' ,'opacity',{duration: 10000,onComplete: function(){setInterval(miEfecto_i61.start(0,1) , 15000 );}});
miEfecto_i1.start(0,1);});
 

entiendo que poniendo esto:

Código Javascript:

var miEfecto_i60 = new Fx.Style('texto42' ,'opacity',{duration: 1000,onComplete: setTimeout(function(){miEfecto_o60.start(1,0);},1250);});
 

tendría que hacer la pausa...pero NO LA HACE :(

no se, como lo ves...hay algo mal puesto?

muchas gracias a todo el que pueda ayudar! :)

[hectoralvaez]

Hola KoswiDigital!!

Por fin lo he solucionado!!

ahí va la solución!

Código Javascript:

var miEfecto_i1 = new Fx.Style('texto19' ,'opacity',{duration: 1000,onComplete:function(){setTimeout(function (){miEfecto_o1.start(1,0);},10000);}});
 
var miEfecto_o1 = new Fx.Style('texto19' ,'opacity',{duration: 1000,onComplete: function(){miEfecto_i2.start(0,1);}});
 

muchas gracias por tu ayuda! :)