| |
|
|
| | Здравствуйте, помогите пожалуйсто с решением следующей проблемы.
Как можно сделать что бы при загрузки страницы она темнела( черный фон с прозрачностью) и в центре была картинка (якобы идет загрузка), как только сраница загружаеться все это дело сразу пропадает. | |
| |
|
|
| |
|
|
| |
для: Doorgen
(14.02.2009 в 11:43)
| | |
<head>
<style>
html, body {width: 100%; height: 100%; margin: 0; padding: 0}
#load_tbl {position: absolute; z-index: 999; width: 100%; height: 100%}
#load_th {width: 100%; height: 100%; background-color: #000; filter: alpha(opacity=0); opacity: 0}
</style>
<script>
var OPS = 0;
function f ()
{
with (document.getElementById ('load_th').style) if (navigator.userAgent.indexOf ('MSIE') >= 0)
filter = 'alpha(opacity=' + ++OPS + ')'; else opacity = 0.01 * ++OPS;
setTimeout (f, 21);
}
</script>
</head>
<body onload="document.getElementById ('load_tbl').style.display = 'none'">
<table cellspacing="0" cellpadding="0" id="load_tbl">
<tr><th id="load_th"><img src="" width="200" height="200" style="background-color: red"></th></tr>
</table><script>f ();</script>
...
ваш HTML-код
</body>
|
1. "Поиграйте" значением тайм-аута от 1 до любого разумного целого значения (в примере равно 21 миллисекунде; чем больше значение - тем медленнее будет темнеть). При "игре" поставьте два слеша здесь:
onload="//document.getElementById ('load_tbl').style.display = 'none'">
|
2. Ну и, разумеется, стиль для IMG - style="background-color: red" - нужен только для отладки (пока не заполнен атрибут SRC у этого тега). | |
| |
|
|
| |
|
|
| |
для: PAT
(14.02.2009 в 16:09)
| | | Вообще все кулл. Огромное спасибо. Вот только 1 вопрос, а можно сделать так что бы картинка загрузки не теряла цвета? | |
| |
|
|
| |
|
|
| |
для: Doorgen
(22.02.2009 в 00:27)
| | |
<head>
<style>
html, body {width: 100%; height: 100%; margin: 0; padding: 0}
#load_tbl {position: absolute; z-index: 999; width: 100%; height: 100%}
#load_dv {position: absolute; z-index: 888; width: 100%; height: 100%; background-color: #000; filter: alpha(opacity=0); opacity: 0}
</style>
<script>
var OPS = 0;
function f ()
{
with (document.getElementById ('load_dv').style) if (navigator.userAgent.indexOf ('MSIE') >= 0)
filter = 'alpha(opacity=' + ++OPS + ')'; else opacity = 0.01 * ++OPS;
setTimeout (f, 21);
}
</script>
</head>
<body onload="with (document) {getElementById ('load_dv').style.display = 'none'; getElementById ('load_tbl').style.display = 'none'}">
<div id="load_dv"></div>
<table cellspacing="0" cellpadding="0" id="load_tbl">
<tr><th><img src="картинка загрузки" width="200" height="200" style="background-color: red"></th></tr>
</table>
<script>f ();</script>
...
ваш HTML-код
</body>
|
Для проверки опять же поставьте два слеша в начале инструкции для <body onload= | |
| |
|
|
