Hello All. I'm a beginner with script.aculo.us framework, and I'va
some problem in order to create cross-fade effect:

javascript code:
<script type="text/javascript">
  var divs_to_fade = new Array('fade_product0', 'fade_product1',
'fade_product2', 'fade_product3');
  var current_index = 0;
  var rrrstarted = false;

  function swapFade() {
    Effect.Fade(divs_to_fade[current_index], { duration:1, from:1.0,
to:0.0 });
        current_index++;
        if (current_index == 4) current_index = 0;
        Effect.Appear(divs_to_fade[current_index], { duration:1, from:0.0, to:
1.0 });
  }

  function startPage() {
    if (rrrstarted == false) {
                rrrstarted = true;
                showtime = setInterval('swapFade()',5000);
        }
  }

  function stopPage() {
    clearInterval(showtime);
        rrrstarted = false;
  }

</script>

So, each 5 seconds the transition is done. However, there is a problem
because, the first time this effect (cross-fade) takes 5 seconds, and
the goal would be, that when the mouse is in product_viewer div (see
bellow) the effect begins immediately.

So, now when I set the mouse over the product_viewer div, I need to
wait 5 seconds in order to view the effect, I the first time have to
be immediately.

Thanks for all in advanced.
I will appreciate alot your help.


<div id="product_viewer" onmouseover="startPage()"
onmouseout="stopPage()">
  <div class="fade-box" id="fade_product0">
    <img src="img/EtiProd0.gif"/>
  </div>
  <div class="fade-box" id="fade_product1" style="display: none;">
    <img src="img/EtiRibb0.gif"/>
  </div>
  <div class="fade-box" id="fade_product2" style="display: none;">
    <img src="img/EtiInd0.gif"/>
  </div>
  <div class="fade-box" id="fade_product3" style="display: none;">
    <img src="img/EtiRfid0.gif"/>
  </div>
</div>

<style>

#product_viewer
{
border:double;
        height:45mm;
        margin:0 0 0 10px;
        width:63mm;
}

.fade-box {
        height:45mm;
        margin-left:0;
        position:absolute;
        width:63mm;
}

</style>

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to