How-to display a .gif as background image?
Posted
by Vito De Tullio
on Stack Overflow
See other posts from Stack Overflow
or by Vito De Tullio
Published on 2010-04-06T14:46:15Z
Indexed on
2010/04/06
14:53 UTC
Read the original article
Hit count: 301
Hi! I have a javascript "loading" function like this:
function splashScreen() {
var div = document.createElement('div');
div.appendChild(document.createTextNode("some text"));
div.setAttribute("style",
"position: fixed; " +
"width: 100%; height: 100%; " +
"left: 0; top: 0; " +
"z-index: 1000; " +
"background: #fff url('img/loading.gif') no-repeat center; " +
"font-size: x-large; " +
"text-align: center; " +
"line-height: 3em; " +
"opacity: 0.75; " +
"filter: alpha(opacity=75); ");
document.getElementsByTagName('body')[0].appendChild(div);
return true;
}
I use this function in the form action (onsubmit="return splashScreen()"
) to show a "rotating logo" while the next page load...
The problem is in that "img/loading.gif" and safari (on winXP): in ff and ie I have no problems, and I clearly see the animated gif. In safari I can't see it.
If I change the image with a (obviously static) png the image appears...
Am I doing something wrong? What's the problem with safari?
© Stack Overflow or respective owner