Master-X
Форум | Новости | Статьи
Главная » Форум » Дизайн » 
Тема: Как заставить фоновую графику в первую очередь грузится?
цитата
04/01/08 в 22:40
 uncle Misha
Сабж
цитата
04/01/08 в 23:10
 AWMovies
сильно не пинайте , если я неправicon_smile.gif

но , теоретически можно попробовать рисунок фона вставить в самом начале страницы как 0х0px, он первым загрузится и будет в кэше браузера, соответственно и в фоне покажется сразу...

сам не пробовал...
цитата
05/01/08 в 00:12
 sir.korvin
хранить на другом хосте, посмотри у меня например xfavorites.com так сделано, но на сколько это действенно не скажу 100% icon_smile.gif

Очень много от браузера зависит.
цитата
05/01/08 в 00:15
 AWMovies
симпотная шапкаicon_smile.gif но бек грузится не в первую очередь, сначала шапка, затем тумбы начали, в процессе загрузки тумбы 8-10ой, открылся фон, FireFox 2.0

и у тебя фоновая картинка у td , а не у body, разница наверно есть имхо...
цитата
05/01/08 в 00:27
 lord_deluxe
sir.korvin писал:
хранить на другом хосте, посмотри у меня например xfavorites.com так сделано, но на сколько это действенно не скажу 100% icon_smile.gif

Очень много от браузера зависит.


плохой вариант задавать ячейкам background параметр, каждый раз при загрузке страници оно грузится по новой ..через css лучше в кеше хранится

uncle Misha параметры через css классы задавать ..и все
или вариант через яваскрипт <body onload="функция('images/logo_bg.png')">
цитата
05/01/08 в 00:35
 sir.korvin
lord_deluxe писал:
плохой вариант задавать ячейкам background параметр, каждый раз при загрузке страници оно грузится по новой ..через css лучше в кеше хранится


Не правда. Все одинакого в кэше хранится...

lord_deluxe писал:

uncle Misha параметры через css классы задавать ..и все
или вариант через яваскрипт <body onload="функция('images/logo_bg.png')">


Через onload? Ты в своём уме? Онже сработает после загрузки графики, если не ошибаюсь ;)

Через css как раз более долгий вариант, по своему опыту говорю. А если выносить в отдельный файл то темболее будет хуже.
цитата
05/01/08 в 00:37
 AWMovies
onload вообще не в тему имхо, через css делаю я например, все равно грузится не сразу фон.
цитата
05/01/08 в 00:47
 doomed
Как браузер захочет, так и загрузит. Везде будет плавать от версии к версии и зависить от настроек. Единственно гарантированный вариант - грузить через JS в хидере (чего многие "крутые" партнерки не делают и в итоге их размалеванные графические меню в админках глючат и выглядят убого).
цитата
05/01/08 в 01:14
 lord_deluxe
просто никогда не заморачивался над таким вопросом ..да с onload я загнул ..просто предложил как вариант(че то подумал о перекате картинок они же сразу грузятся) как то переделать ..по поиску пробил ..много всякой инфи как onload переделать ..чтоб не в коце выскакивало а во время и наверно сразу есть фунция
Полюбом +1 что это яваскрипт нужен ..но не вариант что всегда он работать будет
цитата
05/01/08 в 01:23
 uncle Misha
На броузер уповать не хочется...
Через классы в КСС не хочет лиса его вперёд графики показывать
В хедере тоже понятно мне, если для всего тела...
А вот конкретно, мне нужно фоновое изображение для определённого блока указать, а не для всего тела, как такую ерунду в JS нарисовать?
Может кто код может подсказать.
цитата
05/01/08 в 01:51
 Hawkins
Если скорость очень важна, можно сделать два css файла и нужный разместить первым, а второй в конец например засунуть.
цитата
05/01/08 в 02:06
 lord_deluxe
Нужно что то типа этого http://habrahabr.ru/tag/window.onload/
Только модифицировать нужно так чтоб функцию можно было бы прикреплять к конкретному тэгу ..я смотрю много сайтов на этот скрипт ссылаются
цитата
05/01/08 в 03:10
 kodek
AWMovies писал:
рисунок фона вставить в самом начале страницы как 0х0px, он первым загрузится и будет в кэше браузера, соответственно и в фоне покажется сразу...

Вот же толковый совет человек дал, чего мудрить то =)
цитата
05/01/08 в 06:46
 doomed
Как пример (куски кода с моего старого сайта, используются для графического меню уже года 4):

Подключается в хидере (menu.js например), или просто вставляется.

Цитата:

var menu=new Array();
var objCount = 0;
function preload(name, first, second) {
menu[objCount] = new Array(4);
menu[objCount][0] = new Image();
menu[objCount][0].src = first;
menu[objCount][1] = new Image();
menu[objCount][1].src = second;
menu[objCount][2] = name;
menu[objCount][3] = false;
objCount++;
}


Далее вызов сразу после <body> с нужными картинками.

Цитата:

<script language="JavaScript" type="text/javascript">
<!--
preload("img1","/img/menu/news_on.gif", "/img/menu/news_off.gif");
preload("img2","/img/menu/about_on.gif", "/img/menu/about_off.gif");
preload("img3","/img/menu/comp_on.gif", "/img/menu/comp_off.gif");
preload("img4","/img/menu/forum_on.gif", "/img/menu/forum_off.gif");
preload("img6","/img/menu/serv_on.gif", "/img/menu/serv_off.gif");

// -->
</script>


Далее с эти массивом можно делать что угодно. Выводить менюшки где нужно, делать hover, onmouseover, onmouseout, onclick и прочее.

Например вот так:

Цитата:

<td height="23" width="106" align="center"><font class="tgen"><a href="/php/home.php?pg=home&sid={menu.sid}" name="news" target="_top" title="Новости"
OnMouseOver="over('img1'); window.status='Новости';return true"
OnMouseOut={menu.sel11}
OnFocus="on('img1')"
OnClick="off(); on('img1')"><img name="img1" src="/img/menu/news_{menu.sel12}.gif" border="0" width="106" height="23" alt="Новости"></a></font>
</td>


Конструкции вида {menu. } обрабатываются у меня скриптом; on(), off() JS код для обработки. На них не обращаем внимание.

Суть думаю ясна. Если нужно просто загрузить 5-10 картинок, то код совсем простой останется.

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


Эта страница в полной версии