Dude, Let Nathan White's Transitions script break it down like a fraction for you:
http://www.nwhite.net/2008/09/29/transitions-for-mootools/ - Daniel On Jan 25, 10:00 pm, Tom Occhino <tomocch...@gmail.com> wrote: > 1. Please use a nicer tone. Typing in capital letters LIKE THIS is > not going to get your question answered any faster. > > 2. Include mootools.js in your pages. None of the links you shared > include any script more than a snippet of MooTools-like code. You > need to actually include the framework in your pages if you want to > use it. > > 3. Even if you included the script, you're missing some things, your > syntax is incorrect. (myMorph.start('.className'); //notice the dot?) > > 4. Background images cannot be transitioned. More on that: > > * Only Mathematically Calculable values can be transitioned. > * Background Images cannot be animated using CSS / Fx.Morph alone. > * If it's not a color, a dimension / location, or opacity, it cannot > be animated with Fx.Tween or Fx.Morph. > > As Guillermo said, time-based calculations between two numeric > values. If you want some kind of cross fading background image > script, then you can search for that, but if you post again, please > try to use a bit of a nicer tone. > > Thanks, > Tom > > On Jan 25, 2009, at 9:52 PM, Guillermo Rauch wrote: > > > > > Morph works with time-based calculations between two numeric values. > > It won't work with the background-image property. > > I suggest you overlap images and use fade('out') (optionally combined > > with fade('in') on the second image). > > > On Sun, Jan 25, 2009 at 8:35 PM, ksq08 <keith.sp...@ntlworld.com> > > wrote: > > >> Dear Users > > >> I cannot make the morph feature work. I've tried it locally on > >> Dreamweaver, just testing on Firefox. And I've also launched it to > >> two > >> live links and they both don't work. The CSS is engaging but it's > >> static and does not morph to the second state. > > >>http://www.ksqdesign.com/signature/ForwardHo/morpher.html > > >>http://www.ksqdesign.com/morphthisone.html > > >> Both links fail to engage the javascript. I've ensured that the "Dom > >> ready" line starts the javascript file. As per your instructions to > >> users, I'm not "just cutting and pasting", I'm evaluating the > >> javascript and I SPECIFICALLY want to know if a CSS background-image > >> value can be added to the javascript file so that I can make the > >> morph > >> asset work with images. But before I can do that, I need to > >> understand > >> why only the CSS is working and NOT the javascript. Please, what am I > >> doing wrong? I worked with it for hours yesterday. I've made the > >> other > >> mootools morph asset work but this one is structured better for my > >> needs. Why can't I make this one work? > > >> Would you also please be kind enough to advise if I add a > >> "background- > >> image" CSS value here: > > >> Fx.CSS.Styles = ["backgroundColor", > >> "backgroundPosition", "color", > >> "width", "height", "left", "top", "bottom", "right", "fontSize", > >> "letterSpacing", "lineHeight", "textIndent", "opacity"]; > > >> Will that make the morph work with background images? > > >> Many thanks for your time and assistance. > > > -- > > Guillermo Rauch > >http://devthought.com
