Приветствую, уважаемые!

Ткните носом, плз, забыл, как сделать сабж. Помню, что где-то когда-то видел решение, но не помню, где и когда

Есть набор CSS-файлов, необходимо выполнить JS только после того, как эти файлы будут загружены и применены к DOM страницы. Это нужно для расчетов позиций некоторых элементов (т.к. размеры элементов, относительно которых позиционируются требуемые, задаются через CSS).

Заранее благодарен.

Здравствуйте, Flamer, Вы писали:

F>Приветствую, уважаемые!

F>Ткните носом, плз, забыл, как сделать сабж. Помню, что где-то когда-то видел решение, но не помню, где и когда

F>Есть набор CSS-файлов, необходимо выполнить JS только после того, как эти файлы будут загружены и применены к DOM страницы. Это нужно для расчетов позиций некоторых элементов (т.к. размеры элементов, относительно которых позиционируются требуемые, задаются через CSS).

F>Заранее благодарен.

document.styleSheets.length ?

Здравствуйте, Flamer, Вы писали:

F>Приветствую, уважаемые!

F>Ткните носом, плз, забыл, как сделать сабж. Помню, что где-то когда-то видел решение, но не помню, где и когда

F>Есть набор CSS-файлов, необходимо выполнить JS только после того, как эти файлы будут загружены и применены к DOM страницы. Это нужно для расчетов позиций некоторых элементов (т.к. размеры элементов, относительно которых позиционируются требуемые, задаются через CSS).

F>Заранее благодарен.

Может это?

function f(){...};
window.addEvent('domready', f);

'onLoad' ждет загрузки страницы целиком, а 'domready' срабатывает сразу после того, как DOM готов. Вроде так.

Здравствуйте, Дюша, Вы писали:

[]

Д>document.styleSheets.length ?

И как это мне поможет узнать, что стили применены к элементам DOM? Имхо мимо.

Здравствуйте, vadimcher, Вы писали:

[]

V>function f(){...};
V>window.addEvent('domready', f);

V>'onLoad' ждет загрузки страницы целиком, а 'domready' срабатывает сразу после того, как DOM готов. Вроде так.


Спасибо, посмотрим/почитаем про данный вариант.

Здравствуйте, vadimcher, Вы писали:

[]

V>function f(){...};
V>window.addEvent('domready', f);

Почитал про сие действо: оно подходит, когда нужно выполнить код после готовности DOM-дерева, но до загрузки рисунков. В общем, этакая альтернатива window.onload. При случае конечно буду иметь в виду.

Но меня интересует другое: могу ли я быть уверен, что к тому времени, как возникает событие window.onload, все стили, указанные во внешних файлах, уже применены к элементам DOM?

Здравствуйте, Flamer, Вы писали:

F>Но меня интересует другое: могу ли я быть уверен, что к тому времени, как возникает событие window.onload, все стили, указанные во внешних файлах, уже применены к элементам DOM?

Зависит от движка и от фазы луны.

Я так понимаю что тебя интересует final layout. Ну дык он может еще съехать по приходу например содержимого какого <img>.

А какой именно момент тебя интересует? первый on-draw после on-document-complete ?

Здравствуйте, c-smile, Вы писали:


CS>Я так понимаю что тебя интересует final layout.

Типа да. Понимаешь, имею такую ситуацию в FireFox: стили уже приехали, еще не назначены ячейкам таблицы, но уже отрабатывает мой код (впихнутый в window.onload), который динамически создает сплиттеры для столбцов таблицы. Что в итоге имеем: высота сплиттера после загрузки страницы больше, чем нужно, т.к. стили установились уже после того, как отработал мой код. Посмотреть можно здесь (такой эффект наблюдается не всегда, но наблюдается. Как в анекдоте: неаккуратненько как-то.).

CS>Ну дык он может еще съехать по приходу например содержимого какого <img>.

Во блин, а ведь правда... Если <img> сверху грида и приедет сильно позже, то сплиттеры уедут Как это можно пофиксить практически? Перефразируем: куда вставить вызов отработки кода, когда всё-всё уже приехало, в том числе и <img>?

CS>А какой именно момент тебя интересует? первый on-draw после on-document-complete ?

Вполне возможно. Меня интересуют два момента: 1) когда стили применены к элементам, 2) когда приехало и отобразилось все.

Почему так: нельзя долго не создавать сплиттеры — если юзер заказывал сплиттеры, а их нет из-за того, что какой-то рисунок еще не приехал — это не гут. Ну и, по приходу какого-нибудь рисунка неплохо было бы на всякий случай перепозиционировать сплиттеры. Очевидно, что такой рисунок должен находится выше по layout (рисунки ниже нас не интересуют) — вот еще один вопрос .

Вот. Короче, наколбасил я фич, теперь надо обеспечивать их правильную работу

Здравствуйте, Flamer, Вы писали:

F>Здравствуйте, c-smile, Вы писали:

По моему ты что-то концептуально не то делаешь.

Вот смотри как надо: http://www.dowdybrown.com/dbprod/rico-test9/php/ex2.php

Здравствуйте, c-smile, Вы писали:


CS>По моему ты что-то концептуально не то делаешь.

Да нет, все обычное, в общем — абсолютное позиционирование применяется для некоторых элементов.

CS>Вот смотри как надо: http://www.dowdybrown.com/dbprod/rico-test9/php/ex2.php

Пасиб, гляну.

Здравствуйте, c-smile, Вы писали:

[]

CS>Вот смотри как надо: http://www.dowdybrown.com/dbprod/rico-test9/php/ex2.php

Да ну — так не надо Тормозно немного и некрасиво чуть. А настроек у меня тоже хватает Пока единственная проблема — это сделать заголовок таблицы фиксированным в FireFox.

Да, конечно, объектная модель в указанном примере лучше — у меня просто набор функций.

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

З.Ы. Так надеялся что знаменитый c-smile меня похвалит — не дождался

Здравствуйте, Flamer, Вы писали:

F>Есть набор CSS-файлов, необходимо выполнить JS только после того, как эти файлы будут загружены и применены к DOM страницы. Это нужно для расчетов позиций некоторых элементов (т.к. размеры элементов, относительно которых позиционируются требуемые, задаются через CSS).

можно проверить какое то свойство, которое в css файле.


последняя строка main.css:

#cmplt{width:100px;}

файл:

<html>
<head>
<script>
function isReady()
{
    var c = document.getElementById("cmplt");
    if(!c || c.offsetWidth != 100)
    {
        setTimeout("isReady()", 3000);
        alert("не готово");
    }
    else
    {
        alert("готово");
    }
}
isReady();
</script>
<link rel="stylesheet" href="main.css">
</head>
<body>
    <div id="cmplt">&nbsp;</div>
</body>
</html>

F>Есть набор CSS-файлов, необходимо выполнить JS только после того, как эти файлы будут загружены и применены к DOM страницы. Это нужно для расчетов позиций некоторых элементов (т.к. размеры элементов, относительно которых позиционируются требуемые, задаются через CSS).
В jQuery используется такой код: http://jqueryjs.googlecode.com/svn/trunk/jquery/src/event.js (функция bindReady, в jQuery.ready() выполняются все функции, назначенные на выполнение при зугрузке документа)

var readyBound = false;

function bindReady(){
    if ( readyBound ) return;
    readyBound = true;

    // If Mozilla is used
    if ( jQuery.browser.mozilla || jQuery.browser.opera )
        // Use the handy event callback
        document.addEventListener( "DOMContentLoaded", jQuery.ready, false );
    
    // If Safari or IE is used
    else {
        // Continually check to see if the document is ready
        function timer(){
            try {
                // If IE is used, use the trick by Diego Perini
                // http://javascript.nwbox.com/IEContentLoaded/
                if ( jQuery.browser.msie || document.readyState != "loaded" && document.readyState != "complete" )
                    document.documentElement.doScroll("left");
    
                // and execute any waiting functions
                jQuery.ready();
            } catch( error ) {
                setTimeout( timer, 0 );
            }
        }

        timer();
    }

    // A fallback to window.onload, that will always work
    jQuery.event.add( window, "load", jQuery.ready );
}