| Autor | Zpráva | ||
|---|---|---|---|
| LukášO Profil * |
#1 · Zasláno: 18. 2. 2009, 12:13:05
Zdravím,
mám web, který obsahuje množství animací, které se zobrazují až po najetí na určitý odkaz. Ovšem má to ten efekt, že se animace po najetí na odkaz začne teprve stahovat a objeví se až po chvíli. Je mi jasné, že spousta lidí namítne ať zmenším velikost těchto obrázků, ale to ja nechci nebo spíš nemůžu. Chtěl bych tedy aby při otevření stránky se objevil nějaký div, ve kterém by byl nápis něco ve stylu web se načítá a až po načtení všech obrázků, které si zadám se web jakoby otevřel. Nejlepší by bylo, kdyby web byl zašedlý stejně třeba jako v lightBoxu, byl uprostřed nápis načítám a jak by se obrázky načetly tak se stránka objevila. Zkoušel jsem to pžez onload, ale to mi nějak nefungovalo. Díky za jakoukoliv pomoc. |
||
| ninja Profil |
#2 · Zasláno: 18. 2. 2009, 12:46:26
LukášO: navrhovane reseni by rozhodne lepsi nebylo. Co kdyz vubec nebudu chtit animace zobrazit? Stejne me chcete nutit cekat u zasedle obrazovky? Dekuji nechci.
|
||
| LukášO Profil * |
#3 · Zasláno: 18. 2. 2009, 12:50:59
Dekuji za velice funkcni reseni. V takovem pripade raci vypnete pocitac a bezte se ven probehnout. Hledam reseni, ne spekulace. Rozhodnuti co se vice hodi prosim nechte na me :)
|
||
| tiso Profil |
#4 · Zasláno: 18. 2. 2009, 12:58:20
LukášO - skús sem dať link na súčasnú podobu stránky, neviem čo si mám predstaviť pod „se animace po najetí na odkaz začne teprve stahovat a objeví se až po chvíli“
|
||
| LukášO Profil * |
#5 · Zasláno: 18. 2. 2009, 13:08:49
|
||
| imploder Profil |
#6 · Zasláno: 18. 2. 2009, 13:20:38
LukášO
http://www.jakpsatweb.cz/javascript/preload-obrazku.html případně dát celému obsahu stránky v CSS display:none; a při události onload na <body> to javascriptem nastavit normálně na display:block; |
||
| LukášO Profil * |
#7 · Zasláno: 18. 2. 2009, 13:23:57
To s tím onloadem jsem právě zoušel a přislo mi, že animace při najetí na odkaz měli pořád spoždění.
|
||
| LukášO Profil * |
#8 · Zasláno: 18. 2. 2009, 13:40:11
Ted me napadlo, ja tam ty animace totiz nemam klasicky jako <img> ale jako background divu, takze mam takovy pocit, ze ho to bez tak nenacte. Napadlo me tedy jine reseni. Nejaky div ktery bude mit visibility:hidden, v nem budou vsechny ty obrazky ktere potrebuji nacist a tomu divu nastavit onload ??
|
||
| imploder Profil |
#9 · Zasláno: 18. 2. 2009, 13:46:12
LukášO
Ano, mají spoždění, protože se stahujou až jako reakce na ty události - najíždění na odkazy. Správně by se měly načíst hned co nejdřív při vstupu na stránku jako všechno ostatní. Musí se načíst dopředu jako objekty do JS. Javascriptem se pak obrázek přepne, ale v tu dobu už je v paměti, takže se nic nestahuje a je to velice rychlé. Jak na to je vysvětleno právě tady: http://www.jakpsatweb.cz/javascript/preload-obrazku.html Zobrazení celé stránky najednou až když je všechno načtené bych na té stránce určitě nedělal, protože animace pro její používání nejsou zásadní a někoho s pomalým připojením by to mohlo zbytečně zdržet. Takhle možná rychlý klikač s pomalejším připojením animaci neuvidí, ale to ničemu nevadí, na odkaz může kliknout i tak, takže stránka splnila svůj účel. Kdyby se čekalo se zobrazením až na stažení všech animací, tak by ten člověk neměl možnost se tam rychle proklikávat. Že se obrázky na webu načítají až po samotném obsahu má dobrý důvod, i když dneska už to mimo mobily tak nepociťujeme. |
||
| imploder Profil |
#10 · Zasláno: 18. 2. 2009, 13:54:09 · Upravil/a: imploder
LukášO
„Nejaky div ktery bude mit visibility:hidden, v nem budou vsechny ty obrazky ktere potrebuji nacist a tomu divu nastavit onload ??“ Tím se sice dosáhne toho, že se obrázky uloží na disk do cache prohlížeče (pokud nemají nastavené kešování nějak jinak), lepší a čistší řešení je však ten javascriptový preload, běžně se to používá. A obrázek pak bude nejspíš v operační paměti - ta je samozřejmě rychlejší než disk, takže ještě míň zdržení. |
||
| LukášO Profil * |
#11 · Zasláno: 18. 2. 2009, 13:57:18
Díky, vyzkouším to.
|
||
| imploder Profil |
#12 · Zasláno: 18. 2. 2009, 14:05:56
Vždyť už máš preload použitý na této stránce
|
||
| LukášO Profil * |
#13 · Zasláno: 18. 2. 2009, 14:09:42
Já vím, ale to je trošku jiný případ.
Pokud to dobře chápu, preload se chová tak, že máš dva obrázky - první tam je vidět a druhý se objeví po najetí, a funkce preloadu je že ten druhý nezobrazí dokud není stáhlý (aby nedošlo k tomu že tem nebude žádný dokud se ten druhý nestáhne). Ovšem na té úvodní stránce webu tam na začátku žádný nemám. |
||
| habendorf Profil |
#14 · Zasláno: 18. 2. 2009, 15:32:43
Pořád je tu možnost dát vše do jednoho obrázku a šoupat s ním.
|
||
| Bubák Profil |
#15 · Zasláno: 18. 2. 2009, 15:43:06
„Pokud to dobře chápu, preload se chová tak, že máš dva obrázky - první tam je vidět a druhý se objeví po najetí“
Chápeš to špatně, zpravidla se preload sice používá, jak říkáš, ale účelem preloadu je načíst obrázek, který není zobrazen. |
||
| Bubák Profil |
#16 · Zasláno: 18. 2. 2009, 15:49:32 · Upravil/a: Bubák
habendorf
Ale ten obrázek je třeba načíst při hoveru, jinak animace nepoběží od začátku. Další komplikace by byla, poku má každá animace rozdílný počet snímků. Zatím jsem nezkoumal, jak to dělají tady: http://css.interval.cz/priklady/priklad-108-1.htm |
||
| LukášO Profil * |
#17 · Zasláno: 18. 2. 2009, 16:11:42
Ano, každá animace má jiný počet snímků.
|
||
| habendorf Profil |
#18 · Zasláno: 18. 2. 2009, 16:24:11
No tak udělat normální preload.
„tomu divu nastavit onload ??“ Div nemá událost onload. |
||
| LukášO Profil * |
#19 · Zasláno: 18. 2. 2009, 16:41:35
No nakonec asi zkončím u toho preloadu.
|
||
| imploder Profil |
#20 · Zasláno: 18. 2. 2009, 21:39:08
Ano, tady to mají dokonce bez JS. Ale to by na www.atyp-design.cz asi nešlo, protože tam se mění CSS při najetí na jiný prvek než kterému se mění vlastnosti takže se nedá použít pseudotřída :hover.
http://css.interval.cz/clanky/spousteni-animovanych-obrazku/ |
||
| Bubák Profil |
#21 · Zasláno: 19. 2. 2009, 07:16:31
imploder
V odkaze můžu mít více elementů (IMG, SPAN) a každý jde pozicovat, a třeba jim při hoveru měnit visibility. |
||
|
Časová prodleva: 15 let
|
|||
0