Shadow on tooltip

Question

Hi,
I've picked up what I think could be a problem with the
tooltip in IE7.
I used a PNG with a transparent alpha channel as a background
image (to give it a drop shadow) to my tooltip - and it displays
fine cross browser. However if I add useEffect:"fade" to the
tooltip parameters - the PNG looses its transparency (IE7).
It works fine with Firefox.
Has anyone got any ideas how I can resolve this ?

Answer 1

That is because the fade effect leaves a filter atribute on
the element wich causes the png alpha channel to 'fail'
lemme dig up the solution.. i had the same problem in one of
my own websites, will edit with in 5 min :)
edit, or not.
document.getElementById('element_id_here').style.filter = '';
should fix it. But there isnt a easy way to attach and function on
tooltop :( so i current have no further idea's
U could edit the sprytooltip.js and add it in:
search for:
Spry.Widget.Tooltip.Fade.prototype.beforeStop = function()
if (this.from > this.to)
this.element.style.display = 'none';
if (Spry.is.mozilla)
this.element.style.filter = this.origOpacity;
else
this.element.style.opacity = this.origOpacity;
and change to:
Spry.Widget.Tooltip.Fade.prototype.beforeStop = function()
if (this.from > this.to)
this.element.style.display = 'none';
if (Spry.is.ie)
this.element.style.filter = '';
if (Spry.is.mozilla)
this.element.style.filter = this.origOpacity;
else
this.element.style.opacity = this.origOpacity;
I dont know if it works i don't have a the right testing
environment to test this solution, so it might fix it, else it wont
:P
* edit, For got captial S in spry.is.