I searched the web ALOT of times to see if there is an event/property or function in scriptaculous to see
if an effect is started or finished. I couldn’t find it anywhere on the web (yeah I did searched at the website of scriptaculous first)!
A friend of mine DID find a sollution for it and it’s VERY easy!

To bad that scriptaculous has not documented it at all,
but i think they did that for a good reason but i dont
know which one ;) .

Let’s see:

beforeStart : is called before the effect start
afterFinish : is called after the effect finished

This also works for Effect.Parallel !!!!

Example:

new Effect.Morph($('someDiv'), {
	style: {
		height: '200px',
		width: '200px'
	},
	beforeStart: function(){ alert('effect started'); },
	afterFinish: function(){ alert('effect finished'); }
})

Parallel example:

    new Effect.Parallel([
		new Effect.Move($('someDiv'), {
	        sync: true,
	        x: 300,
	        y: 300,
	        mode: 'absolute'
	    })
		,
		new Effect.Morph($('someDiv'), {
	        sync: true,
	        style: {
	            height: '200px',
	            width: '200px'
	        }
	    })

	], {
        duration: 1,
		beforeStart: function(){
            alert('effect started');
        },
        afterFinish: function(){
            alert('effect finished');
        }
    });

Basicly i dont know the impact to the effects if ya use this solution.

But it works just fine.

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • Furl
  • LinkedIn
  • StumbleUpon
  • Technorati
  • TwitThis
  • NuJIJ