-
Data: 2010-12-16 20:48:08
Temat: Re: prosty loader w JS na stronę
Od: Peter May <p...@o...pl> szukaj wiadomości tego autora
[ pokaż wszystkie nagłówki ]W dniu 2010-12-16 18:22, Paweł Piskorz pisze:
> On 2010-12-15 21:18, Peter May wrote:
>> W dniu 2010-12-15 20:42, Paweł Piskorz pisze:
>>> On 2010-12-15 14:13, Peter May wrote:
>>>> Weź dodaj prosty <div id="preload"> (koniecznie JavaScript-em) z
>>>> tekstem
>>>> "Trwa ładowanie" w <head>, a potem podepnij pod zdarzenie onload w body
>>>> usunięcie tego. I po sprawie.
>>>
>>> W head nie dodasz nic do body, bo body jeszcze nie istnieje. Timeouta
>>> nie ma jak wyliczyć, zaś onload/ready to już zapóźno ;]
>>
>> Argh... miało być tuż przed </body>
>
> Tuż przed </body> to już stronę dawno widać, próbuj dalej :D
Stronę widać, ale się nie załadowała. A to różnica. Szczegółowo to
zrobiłbym to tak:
1. Zakładam, że html mógłby mniej więcej tak wygląda:
[...]
<body>
<div class="overlay">
[...]
cała reszta
[...]
<div id="footer"></div>
</div>
</body>
2. W <head> ustawiam klasę np. js_on dla <html>-a, JavaScript-em, a w
CSS-ie dodaję takie style:
.js_on div.overlay{
background:#fff;
z-index:1000;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
3. Do footer pakuję znów JS, gdzie generuję sobie bajerancki tekst "Trwa
ładowanie" oraz pod zdarzenie onload dla obiektu window podpinam
funkcję, która usunie mi div.overlay.
W ten sposób user nie zobaczy strony dopóty, dopóki nie załaduje mu się
ona w całości. A przynajmniej do czasu wywołania funkcji w zdarzeniu
onload dla obiektu window.
A jeszcze bardziej szczegółowo to wywołanie funkcji powinno nastąpi
wtedy, gdy jesteś w sytuacji pt. "DOM content is ready". Opis można
znaleźć np. tutaj:
http://subprint.com/blog/demystifying-the-dom-ready-
event-method/
--
Peter
Najnowsze wątki z tej grupy
- Perfidne ataki krakerów z KRLD na skrypciarzy JS i Pajton
- Do sądu trafił pozew zbiorowy przeciw Google'owi - oskarżenie o praktyki monopolistyczne na rynku reklamy internetowej
- Jakie znacie działające serwery grup dyskusyjnych?
- is it live this group at news.icm.edu.pl
- php, linki z nazwami a $_GET, SEO
- www polityka pl captcha
- dyktatura brudnego palucha
- www.znanylekarz.pl
- Czy pytanie o sczytywanie stron programami/skryptami to tu?
- Grupy webdevowe
- Jak wydrukować stronę?
- IIS, kilka witryn
- linki <a href="/strona.php"> (ze slashami)
- co rozszerza stronę??
- responsywny akapit <p>
Najnowsze wątki
- 2025-04-26 Środa Wielkopolska => SAP FI/CO Internal Consultant <=
- 2025-04-26 Patrole obywatelskie.
- 2025-04-26 Warszawa => Presales Engineer IT <=
- 2025-04-26 Gdynia => Przedstawiciel handlowy / KAM (branża TSL) <=
- 2025-04-26 Rudno => IT network administrator <=
- 2025-04-26 Dęblin => Node.js / Fullstack Developer <=
- 2025-04-25 Sprawdzić czy spółka ma sprawy w sądzie
- 2025-04-25 Solarny Palnik Wodorowy
- 2025-04-25 amperomierz w plusie
- 2025-04-25 nie wyłączam silnika
- 2025-04-25 PILNE !! Stara żywność w marketach "Zgodnie z obowiązującym od stycznia 2024 r. prawem przeterminowana, ale nadal zdatna do spożycia żywność, może być sprzedawana przez maksymalnie kolejne 45 dni po dacie na opakowaniu. To legalne tylko wtedy, gdy opakowa
- 2025-04-25 Łódź => Team Lead Data Engineer (Snowflake) <=
- 2025-04-25 Pruszków => Key Account Manager IT <=
- 2025-04-25 Warszawa => Business Development Manager - Network and Network Securit
- 2025-04-25 Kto używa elektrolizera do wytwarzania wodoru do palnika ?