My assumption is the css properties in 'anotherEl' that your morphing are
not initialized at start up. This means when you call
"LightboxOpen.start('.LightboxOpenClass')" the css properties are undefined
so it is impossible for mootools to calculate a transition.A couple of other comments. 1. It is bad form to create a new instance of Fx.Morph every time an event is fired. 2. anotherEl fires a fade and immediately fires the morph. These two transitions could be grouped as one, or a chain could be used for better control. 3. Your onComplete function on your Fx.Morph is extremely inefficent code. Each time the transition is complete your doing two heavy DOM queries. It is also hard to know exactly what your trying to achieve without seeing the rest of code but using a class to query your elements once and use referneces to your Fx objects and elements would probably make things easier. I recommend checking out Aaron's awesome site, http://www.mootorial.com/wiki/mootorial/02-class is a tutorial on using classes in mootools. Best, Nathan http://www.nwhite.net/ On Sat, Jan 3, 2009 at 7:34 AM, aka CoolWhiteDude (aka c1hundred) < [email protected]> wrote: > > Hi, I'm new to this group... > > I have the code below which removes and adds a class onComplete of a > morph effect, this works fine but only after the second this morph is > used. I mean load the page activate it once and it doesn't work, any > other time after and it does, can anyone tell me why? All replies are > kindly appreciated. > > $('openLightbox').addEvent('click', function(e) { > e.stop(); > // Changes the element's style to .myClass defined in the CSS > anotherEl.fade('0','1'); > > var LightboxOpen = new Fx.Morph(anotherEl,{ > onComplete: function(){ > $$('.content').removeClass('contentHide'); > $$('.contentHide').addClass('content'); > } > }); > LightboxOpen.start('.LightboxOpenClass'); > }); > > c1hundred
