Ok, so I tried setting the {unit:'em'} option in the Morph
consrtuctor, but it didnt seem to do anything.
My JS code is:
var h1 = $(document).getElement('h1');
var morph = new Fx.Morph(h1, {unit : 'em'});
(function(){h1.morph('h1.loading')}).delay(1000);
And CSS looks like:
h1 {font:normal 1.75em Tahoma, sans-serif; padding:10px 0; margin:0;
background:url('../images/loading_h1.gif') no-repeat 0 50px;}
h1.loading {background-position:0 10px; padding-left:32px; font-size:
1.75em;}
In the end, I just realized I didnt need to include the font-size rule
in .loading, but for posterity I would like to know if I was using the
unit option wrong?
Thanks
Jacob
On Jan 2, 12:25 pm, Jacob <[email protected]> wrote:
> Thanks for all the replies, I will investigate the "unit" option!
>
> On Jan 1, 9:38 am, Michal <[email protected]> wrote:
>
>
>
> > I think you might need to use the 'unit' option in the Fx.Morph
> > constructorhttp://mootools.net/docs/Fx/Fx#Fx:constructor. I forget
> > about this option all the time, and typically it takes me ages to
> > remember to figure out why my Morphs are the wrong size!
>
> > Michal.
>
> > On Dec 31 2008, 6:50 pm, rpflo <[email protected]> wrote:
>
> > > I just tested morphing to another css class and it doesn't seem to
> > > work like I expect it to either, the css says em but it morphs to
> > > pixels.
>
> > > It does work, however, if you define it like I mentioned before.
>
> > > On Dec 31, 11:44 am, rpflo <[email protected]> wrote:
>
> > > > This works:
>
> > > > $('dopeSauce').morph({font-size : '10em'});
>
> > > > Haven't tested it with morphing to a css class, however.
>
> > > > On Dec 31, 10:33 am, Jacob <[email protected]> wrote:
>
> > > > > I have a morph instance that is using a classname, so it looks like
>
> > > > > h1.morph('h1.loading')
>
> > > > > and h1.loading has the rule {font-size:1.75em}
>
> > > > > Mootools morphs this instead to {font-size:2px}. The same problem but
> > > > > inversed happens if I use a percentage for font size. If I used a hard
> > > > > pixel value {fonts-size:24px} it works just fine.
>
> > > > > Does Mootools understand EMs and %s as relative measurements?
>
> > > > > Thanks
> > > > > J