Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Отрисовка элемента до body (https://javascript.ru/forum/dom-window/23263-otrisovka-ehlementa-do-body.html)

belkir 18.11.2011 08:35

Отрисовка элемента до body
 
Всем привет! Возник следующий вопрос:

Делаю слой "загрузки" страницы. Т.е. пока страница грузится - висит див на всю страницу на верхнем слое и не даёт клацать юзерам по незагрузившейся странице. Как выяснил в инете: отрисовывать его надо сразу как открывается body и скрывать перед его закрытием. Но вот в чём проблема: моя библиотека подключается в <head>, а к этому моменту времени body ещё не существует при загрузке страницы. Скрыть я легко могу див, повесив обработчик на window.onload а вот как его корректно отрисовать без вставки вызова функции непосредственно в сам html??? Посоветуйте пож-та способы решиние этой траблы. Спасибо.

ksa 18.11.2011 08:49

Цитата:

Сообщение от belkir
как его корректно отрисовать без вставки вызова функции непосредственно в сам html?

Так и "отрисуй"...

<body onload='shadowOff()'>
<div id='shadow'></div>
...


А в ЦСС укажи shadow все нужные свойства

belkir 18.11.2011 09:59

блин, читайте пож-та внимательнее!

Цитата:

Сообщение от belkir
отрисовать без вставки вызова функции непосредственно в сам html


ksa 18.11.2011 10:04

Цитата:

Сообщение от belkir
блин, читайте пож-та внимательнее!

Ой, ой, ой... Ну прости бестолкового... :cray:
Только как понять те слова правильно?

belkir 18.11.2011 10:15

библиотека подключается в HEAD больше в html-файле ничего нет. Т.е. все действия должна производить библиотека сама. Мы даже не можем дописать в body тэг div. Его можно вствать через document.createElement(); но как его отрисовать, если ко времени подключения библиотеки тэга body на странице ещё нет! (он ещё не догрузился)

ksa 18.11.2011 11:01

belkir, уже лучше... :)
Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function(){
	var val='<p>Test...</p>'
	$(document.body).append(val);
});
$(window).load(function(){
	alert('Страница загружена');
});
</script>
</head>
<body>
</body>
</html>

da_ff 18.11.2011 13:31

Зачем вообще вставлять div? Cкройте контент (css) и покажите лоадер на body опять же css'ом.

belkir 18.11.2011 15:24

Цитата:

Сообщение от da_ff (Сообщение 137396)
Зачем вообще вставлять div? Cкройте контент (css) и покажите лоадер на body опять же css'ом.

ок. Пример в студию!

belkir 18.11.2011 15:32

Цитата:

Сообщение от ksa (Сообщение 137369)
belkir, уже лучше... :)
Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function(){
	var val='<p>Test...</p>'
	$(document.body).append(val);
});
$(window).load(function(){
	alert('Страница загружена');
});
</script>
</head>
<body>
</body>
</html>

А как быть без JQuery???

ksa 18.11.2011 15:36

Цитата:

Сообщение от belkir
А как быть без JQuery?

1000р...


Часовой пояс GMT +3, время: 09:44.