VPF::Пока сайт не загрузится - Форум программистов

Daimond

Дата 22.7.2008, 14:01 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 1
Регистрация: 22.7.2008

Репутация: нет
Всего: нет

Здравствуйте,
у меня сайт на котром прилично графики.
Есть прелоудер на js

Код


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<script type="text/javascript">
function hideLoading() {
    document.getElementById('pageIsLoading').style.display = 'none';
}
</script>

</head>
<body>


<div id="pageIsLoading"
    style="
        position:          absolute;
        display:            block;
        padding-left:    44px;
        padding-right:  12px;
        width:             auto;
        height:            46px;
        line-height:      46px;
        border:            1px solid #890000;
        color:              #000000;
        font-weight:    bold;
        background-color: #ffffff;
        background-image: url(http://www.seo-webdesign.ru/images/loader.gif);
        background-position: 6px center;
        background-repeat: no-repeat;">

        <script type="text/javascript">
            if (typeof window_width == 'undefined' || typeof window_height == 'undefined') {
                var window_width;
                var window_height;
                if( typeof( window.innerWidth ) == 'number' ) {
                  window_width = window.innerWidth;
                  window_height = window.innerHeight;
                } else if( document.documentElement &&
                    ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
                  window_width = document.documentElement.clientWidth;
                  window_height = document.documentElement.clientHeight;
                } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
                  window_width = document.body.clientWidth;
                  window_height = document.body.clientHeight;
                }
            }
            var left = Math.round((window_width - 200) / 2);
            var top = Math.round(((window_height - 46) / 3) + 46);
            document.getElementById('pageIsLoading').style.left = left+'px';
            document.getElementById('pageIsLoading').style.top = top+'px';
        </script>
    Загружается... Ждите...
</div>
<!---------ЗДЕСЬ КОНТЕНТ САЙТА------------>
<!---------ЗДЕСЬ КОНТЕНТ САЙТА------------>
<!---------ЗДЕСЬ КОНТЕНТ САЙТА------------>
<!---------ЗДЕСЬ КОНТЕНТ САЙТА------------>
<!---------ЗДЕСЬ КОНТЕНТ САЙТА------------>
<!---------ЗДЕСЬ КОНТЕНТ САЙТА------------>
<script type="text/javascript">
if (window.addEventListener) {
    window.addEventListener('load', hideLoading, false);
} else if (window.attachEvent) {
    var r = window.attachEvent("onload", hideLoading);
} else {
    hideLoading();
}
</script>

</body>
</html>

Вот. Как вызвать lightbox в тот момент когда висит надпись "Загружается...Ждите"
Ну чтобы позади надписи был затемненный экран. Или подскажите как это реализовать на css (что меньше нравится).
Заранее спасибо! smile

JSman

Дата 24.7.2008, 12:18 (ссылка)

(голосов:1)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 279
Регистрация: 10.7.2006

Репутация: нет
Всего: 4

Возьми однопиксельный рисунок, поставь его в абсолют, выбери индекс слоя, растяни во все стороны, делай прозрачность рисунка.

А вот тебе подарочек из моего фреймворка))

Код


Fx.Opacity = 
{
    set : function (node, value) 
    {
        node.style.opacity = value / 100;
        node.style.filter = ['alpha(opacity=',value,')'].join('');
    }
}

JSman

Дата 3.8.2008, 12:19 (ссылка)

(голосов:1)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 279
Регистрация: 10.7.2006

Репутация: нет
Всего: 4

Код


<script type="text/javascript">
Fx.Opacity = 
{
    set : function (node, value) 
    {
        node.style.opacity = value / 100;
        node.style.filter = ['alpha(opacity=',value,')'].join('');
    }
}
var node;

window.onload = function ()
{
       node = document.getElementById('picture');
       Fx.Opacity.set(node, 50);
}
</script>

Добавлено через 2 минуты и 4 секунды
*{zoom: 1} в css добавь

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »