You only clone your element at the begining, try the following:
window.addEvent('domready',function(){
function fixClearType(el) {
el = $(el);
if(el) {
var elc = el.clone(true, true);
elc.replaces(el);
el.destroy();
}
}
$('tips').setStyle('opacity', 0); // make it transparent
$('en').addEvents( {
mouseenter: function(){
var tween = $('tips').get('morph', {wait:
true, duration: 200});
tween.start({'opacity' : 1, 'padding' : '5px 0
0 0'}).chain(function
(){ fixClearType('tips');});
},
mouseleave: function(){
var tween = $('tips').get('morph', {wait:
true, duration: 100});
tween.start({'opacity' : 0, 'padding' : '0 0 0
0'});
}
});
});
On Jan 8, 7:28 am, guillem <[email protected]> wrote:
> Do you guys need the html and the stylesheet in order to solve the
> problem?
>
> On 7 jan, 18:12, guillem <[email protected]> wrote:
>
> > hi,
>
> > I'm using a workaround in order to recover Cleartype when fading in
> > and out a block of text, using the clone function.
> > It work just great the very first time, everything going smoothly
> > while mouseover and mouseleave. But if you give it a try a second
> > time, cleartype is gone!
>
> > here the javascript:
>
> > window.addEvent('domready',function(){
>
> > var log = $('tips').clone(); //clone element
> > log.set('id','tips'); //set attribute
> > $('tips').setStyle('opacity', 0); // make it transparent
>
> > $('en').addEvents( {
>
> > mouseenter: function(){
>
> > var tween = $('tips').get('morph', {wait: true,
> > duration: 200});
> > tween.start({'opacity' : 1, 'padding' : '5px 0 0
> > 0'}).chain(function
> > (){ log.replaces('tips');}); //make it opaque, then replace the text
> > with the clone in order to get Cleartype back on IE7
>
> > },
> > mouseleave: function(){
>
> > var tween = $('tips').get('morph', {wait: true,
> > duration: 100});
> > tween.start({'opacity' : 0, 'padding' : '0 0 0 0'});
>
> > }
> > });
>
> > Do you guys have any clues?
>
> > Thanks for all!
>
>