Script.aculo.us - Effect.Appear display: and background: solutions 36
There’s bit of a bug with Effect.Appear and IE. There’s a discussion open on it here.
Basically there are 2 issues discussed with Effect.Appear:
- doesn’t work if the display: property is not set to ‘none‘
- if the :background property is not set, the text is bolded while appearing, then switches to the chosen weight
The obvious remedy to both 1) and 2) is to set display: none; and background: #hex; before calling Effect.Appear. The problem with 2) occurs when you’re background is an image.
For my use, I needed to repeatedly call Effect.Appear using the Rails AJAX method periodically_call_remote. I’ve setup the following JavaScript function to handle 1) and 2). It can be used as a one time call before calling Appear, or repeated calls as in my use. See the quote fading in after a few seconds on the w2wwp implementation of my Simple CMS Rails app.
=> RHTML
:complete => "myAppear('myDiv', '#ccc')"
=> JavaScript
function myAppear( mydiv, bckgrd)
{
el = document.getElementById(mydiv);
el.style.background = bckgrd;
el.style.display = 'none';
new Effect.Appear(mydiv);
}
