So I am working on a project and have implemented Spry for a specific portion of the site. The effect is really nice, loading events for each day of the week as you click the day name without a page refresh. Since there are images and text involved I thought it would be very cool to have a fade out/fade in effect as each day was selected.

The problem I experienced was trying to get the fade in and fade out effect to work properly. I was getting a flickering effect because the two events were happening within the same function with no notion of when the data was actually loaded. Then Ray Camden point out to me that Spry has observers. These observers can be set to watch either a data set or a region and can be fired on a specific event.

So the trick was to fire off my fade out effect and an observer call when I made the data call. Once the region had changed I fired the fade in effect and removed the observer. This worked very nicely!

Here's an example:

Also, note that this example is probably not best practice. If an effect is taking place when another effect is called you may experience weirdness. Ray Camden suggested I look to set a flag if the effect is still running and wait to run the new effect until after the current effect has finished processing... maybe Ill post on that soon!