views:

18

answers:

1

Hi,

I've used Scriptaculous before (including effect queues). For some reason, I can not get two images to animate one after the other. Here is the html code:

<img id=redDot src='images/home_img_icon1.jpg'> 
<br>
<br>
<img id=text55 style="display:none" src='images/home_img_icon2.jpg'>

and my scriptaculous code:

<script language="javascript">
    Effect.Grow('redDot');
    Effect.Appear('text55', {queue : 'end'});
</script>

You can see a live demo here: http://www.365pledge.com/tmp/55Thompson/prototype/

What I want is for the first image to grow, and then for the other image to appear. Instead, they both animate at the same time. Thanks for any help you can provide!

+1  A: 

Your usage should work, but just in case, did you try :

new Effect.Grow('redDot', { queue: 'front' });
new Effect.Appear('text55', { queue: 'end' });

Also, missing the "new" in front of your effects might be what's bugging it.

Jesse
dude, you're a genious. i've been working on this for four hours. thank you so much! what is going on with that 'front' thing? on other pages, it is sufficient for me to just queue to the back. what does front do?
tba
Well, because of the way js is parsed (I don't know that much about it), apparently you can add effects to the front of the queue after you've started the queue. So, if you were to switch the two lines of code I gave as an example, they would do the same thing.Here's the page in the wiki that explains all the effect queue stuff, there's a lot you can do with them : http://wiki.github.com/madrobby/scriptaculous/effect-queuesCheers!
Jesse