« 1 2 »
Autor Zpráva
Wily.
Profil *
Ako funguje cteni z externeho *.css suboru ?
Ak mam v *.css vlasnost background-image: url(obrazok.jpg) tak sa ten obrazok stiahne hned po precteni triedy alebo to zavisi od toho ci je dana trieda pouzita v *.html subore?
izsak
Profil
Až potom, čo je použitá v (x)HTML dokumente.
Wily.
Profil *
a je lepsie pre 4 html stranky pouzit 1 css subor alebo rovno 4 ?
izsak
Profil
Podľa toho, aký majú vzhľad. Určite však áno, lebo CSS súbory sú cachované a teda sa ušetrí na prenesených dátach.
Jake
Profil
Wily.
pokud mají stejný vzhled tak použij jeden stejný, když mají vzhled jiný tak použij odlišné.
Wily.
Profil *
ok,
takže mám dva css ext. subory (1.css, 2.css) a v každom volám iný obrázok.
1.css má 1.jpg,
2.css má 2.jpg,

Ďalej mám 2 html subory (1.htm, 2.htm).
1.htm používa 1.css,
2.htm používa 2.css,
1.htm má odkaz na 2.htm.
-------------------------------------
Obrázok 2.jpg sa mi stiahne až potom čo kliknem (v 1.htm) na 2.htm, že ?
A ja potrebujem aby sa stiahol už v 1.htm.
Ako to najlepšie spraviť ?
=====================
Ak si 2.jpg dam do 1.htm pomocou vlasnosti hidden, tak sa ten obrazok už v 2.htm nebude sťahovať ?
Najde si 2.css cestu k tomu obrazku ?

:o)
Honza Hučín
Profil
Můžeš nechat obrázek v 1.htm nakešovat Javascriptem. Do hlavičky dáš:

<script>
var obr = new Image();
obr.src = '2.jpg';
</script>

Klient obrázek stáhne, samozřejmě nezobrazí, ale pokud může, uloží ho v keši.
Leo
Profil
1, Treba Firefox stahuje i background-image obrazky pro div s visibility: hidden
2, Dalsi moznost (krome JavaScriptu) jak prednatahnout obrazky v CSS je umistit je tak, aby nemohly byt videt, i kdyz formalne na strance budou pouzite. JavaScript je az posledni reseni.

Leo
Leo
Profil
"1, Treba Firefox stahuje i background-image obrazky pro div s visibility: hidden"

A IE6 i pro div s display: none... Leo
habendorf
Profil
IMHO všechny browsery stahují obrázky s visibility: hidden.
Obrázky s display: none stahuje IE a Gecko, Opera ne.
Leo
Profil
Mimo tema: Skoda, ze nestahuji obrazky pro a:hover, jeste predtim, nez k tomu hover dojde :-) Leo
Wily.
Profil *
ešte by sa možno dal obrazok ostreliť pomocou margin na -1000px 0 0 0;
Wily.
Profil *
Honza Hučín

ako zistím že sa ten obrázok nakešoval? kde bude umiestneny na disku?
Wily.
Profil *
Tak už to vidim.. je to v Temporary Internet Files
Wily.
Profil *
no ale aj tak.. keď použijem v 1.htm níže uvedený sript:
-------------------------
<script>
var obr = new Image();
obr.src = '2.jpg';
</script>

------------------------
tak sa mi v Temporary Internet Files vytvorí složka pr. 2vav2hqv
a v nej súbor 2.jpg.
ale keď kliknem na odkaz 2.htm nevytvorí sa mi nová složka pr. 7z977h8o s 2.css a 2.jpg ??

To by pak nesplňalo svoj účel.

Nájde si 2.css cestu k 2.jpg v 2vav2hqv ?

ďekuji za objasneni :)
Leo
Profil
Temporary Internet files nestudujte. Studujte komunikaci klienta (prohlizece) se serverem - napriklad si zagooglujte pro Live HTTP headers pro Mozillu (Firefox) nebo ieHTTPheaders pro IE. Pak uvidite co se kesuje a co ne. Leo
Wily.
Profil *
Diky, docela dobra vec.
Konečne som to pochopil :)
Wily.
Profil *
ešte mi neda..

1) Ten vypis je podľa toho kedy sa sťahovnie skončilo a nie kedy sa začalo, že ?
Ja by som potreboval zistiť ktory subor sa začal sťahovať ako prvy,druhy.. atď,
pretože tie obrazky ktore si chcem "dopredu" nakešovať chcem sťahovať ako posledne.

2) Ak použijem ten JavaSript v hlavičke tak sa začnu sťahovať ako prve ?

3) Ako docielym toho aby sa začali sťahovať až po uvolneni linky?
Leo
Profil
No poradi stahovani obrazku ramci dane stranky zase az tak neoblivnite, to si zarizuje prohlizec. Jinak poradi je chronologicke, akorat Mozilla udelatko ukazuje poradi pozadavku (GET) a hned za nima odpovedi serveru (i kdyz ty muzou byt v realu v prehazenym poradi), zatimco IE udelatko ukazuje skutecne poradi, takze je nekdy trochu problem zjistit ktera odpoved serveru patri ke kteremu pozadavku...

ad 2, Zkuste si a uvidite :-) jinak je podle me nesmysl stahovat nejdriv obrazky, ktery pouzijete az na dalsi strane... myslim, ze uzivatele zajima hlavne ta strana, kde je ted :-)

ad 3, cemu rikate uvolneni linky?

Leo
Wily.
Profil *
Leo

1) uzivatele zajima hlavne ta strana, kde je ted :-)
To je pravda ale ja mam špecificky problem..
Na dalšej stranke pouzivam onmouseover na 10-tich odkazoch.
Pri prejiždeni myšou cez tieto odkazy sa meni na jednom mieste 10 obrazkov.
Ak by som si to nenakešoval stranku predtym tak by to vypadalo divne.
A o tom že použivam modem ani nehovorim :o)

2)Niekde som čital (možno to bolo aj na JPW) že pri pripojeni na stranku sa otvori 6 až 9 liniek, čiže ak sťahujete 10 obrazkov tak 9 sa sťahuje a 1 čaka.
Neviem či to je presny termin ale uvolneni linky som myslel - uvolnenie linky.
Opravite ma ?
Ďakujem
Wily.
Profil *
ad 3) cemu rikate udelatko ?
Leo
Profil
No to jste ale mel rict zrovna, ze potrebujete preload kvuli ODKAZUM. Pak jste si mohl tyhle skrcky usetrit, ale HTTP hlavicky se hodi prohlizet i tak. Kouknete se na

http://www.wellstyled.com/css-nopreload-rollovers.html

Niekde som čital (možno to bolo aj na JPW) že pri pripojeni na stranku sa otvori 6 až 9 liniek, čiže ak sťahujete 10 obrazkov tak 9 sa sťahuje a 1 čaka.
Neviem či to je presny termin ale uvolneni linky som myslel - uvolnenie linky.

Jo, existuje maximalni pocet otevrenych spojeni jeden klient / jeden server, ale to si zajistuje prohlizec sam, takze webmaster se o to nemusi moc starat. Maximalne si z toho vzit ponauceni, ze cim min samostatnych souboru (obrazku) tim lip. Co se da spojit, tak spojit.

Leo
Leo
Profil
Udelatko rikam napriklad tem programkum (pluginum, extenzim, apod.) pro prohlizeni HTTP hlavicek. Leo
Wily.
Profil *
Leo
Maximalne si z toho vzit ponauceni, ze cim min samostatnych souboru (obrazku) tim lip. Co se da spojit, tak spojit.

najlepšie by bolo mať tolko samostatnych suborov kolko je otvorenych spojení, tak okolo 6, že ?. Keď mam na hlavnej stranke 50 kilovy obrazok tak ho rozsekam na 6 časti.

a ešte jedna vec, nezavisi poradie sťahovania souborov podľa poradia v javascripte ??

<script>
var obr = new Image();
obr.src = '1.jpg';
obr.src = '2.jpg';
obr.src = '3.jpg';
obr.src = '4.jpg';
</script>
Leo
Profil
No nejlepsi je mit externich souboru co nejmin :-) a co nejmensich. Pokud prohlizec potrebuje stahnout vic souboru nez muze stahovat soucasne, pak si to nejak radi do fronty a jak se mu uvolni spojeni, tak ja proste zacne stahovat. Co se u tohohle da optimalizovat - ale tyka se to nastaveni serveru - je jednak kesovani obrazku, jednak to, aby server pokud mozno mel nastaveno keep-alive, aby pote, co si prohlizec stahne obrazek spojeni neukoncil a na tom samem spojeni se mohl stahovat dalsi.

Jinak pokud vam zacnou zajimat tyhle veci (neco jako od HTTP k TCP/IP), vrele doporucuju poucne a kouzelne video Warriors of the Net (v plne kvalite ma asi 121 MB):

http://www.warriorsofthe.net/movie.html

Odpoved na druhou otazku, v jakym poradi si prohlizec vyzada soubory (obrazky) vam zodpovi prohlidka HTTP hlavicek :-) Leo
Wily.
Profil *
warriorsofthe.net movie docela pekna ukážka ale skušal ste to simulovať cez 50k modem ? je to ako matrix :o) to chce T1.

a ešte doplním ten Preload.
O tom preloudu viem, ale aku to ma vyhodu oproti onmouseover ?
Obrazok musíte stiahnuť tak-či-tak, alebo vám ho ten a:hover uvarí z vody ?

a keby som mal popísť celý problém (v predošlích príspevkoch som ho skrátil) tak je to:

v 2.htm mám 10 onmouseover odkazov na 10 roznych *.css suborov. V každom
css subore mam jiny jpg obrazok.

<LINK REL="stylesheet" type="text/css" href="../css/1.css">
<LINK REL="stylesheet" type="text/css" href="../css/2.css">
<LINK REL="stylesheet" type="text/css" href="../css/3.css">
-----------------------
<script type="text/javascript">
function ZmenCSS(x) {
document.styleSheets[1].disabled = (x!='p1');
document.styleSheets[2].disabled = (x!='p2');
document.styleSheets[3].disabled = (x!='p3');
}
</script>
------------------------
<a onmouseover="ZmenCSS('p1')" onmouseout="ZmenCSS('p0')"> x </a>
<a onmouseover="ZmenCSS('p2')" onmouseout="ZmenCSS('p0')"> y </a>
<a onmouseover="ZmenCSS('p3')" onmouseout="ZmenCSS('p0')"> z </a>
-----------------------
Yuhů
Profil
ano, prohlížeč na jeden server navazuje jenom určitý počet současných spojení. Nevím přesné číslo ani to, kde se to nastavuje, ale třeba pro Explorer je to číslo od dvou do šestnácti.
Leo
Profil
Vyhoda a:hover preloadu oproti onmouseover? To plete dve veci dohromady. Zacit musite HTML a to konkretne tim, jestli na strance chcete mit odkaz (aby se uzivatel dostal na dalsi stranu). Pokud ano, a chcete aby se menil obrazek v tom odkazu, pak staci pouzit a:hover, je zbytecne do toho tahat JavaScript. Problem je v tom, ze nemuzete pri hover najednou chtit jiny obrazek - prohlizec by ho zacal stahovat ze serveru az ted. Takze ta finta spociva v tom, ze background-image je ve skutecnosti tvoreny zcasti obrazkem pro normalni odkaz, zcasti obrazkem pro odkaz na kterem je kurzor mysi (stav hover), a to v jednom souboru. Pri hover zmenite v CSS jen background-POSITION. Takze zadny preload neni treba - v okamziku, kdy je videt normalni menu je stazena i druha pulka obrazku pro hover.

Pokud tam ovsem nemate odkazy a chcete jenom pri najeti mysi na neco zmenit nekde obrazek, udelate to jen JavaScriptem (neni nic horsiho nez pro to zneuzivat odkazu s href="#" nebo href="javascript:..."), a pak muzete JavaScriptem ten preload udelat taky.

Jinak jsem varoval, ze warriors jsou vetsi. Pred modem jsem to netahal, mam to stesti, ze mam pausal na UPC. Leo
Leo
Profil
Napriklad Firefox (ktery je spolu s Mozillou mnohem "didakticteji" zamereny browser) ma v about:config (napise se tohle do adresniho radku)

network.http.max-connections-per-server 8

jako vychozi nastaveni.

Leo
Wily.
Profil *
a:hover Preload
"Problem je v tom, ze nemuzete pri hover najednou chtit jiny obrazek - prohlizec by ho zacal stahovat ze serveru.."

Ja v tom background-position nevidim žiadnu výhodu. Proste si background-image v hlavičke daneho html suboru nakešujem pomocou JavaScriptu do TIF a potom si ho už prohlížeč nemusí sťahovať zo servru, nie ?
A časovo sa mi to zdá rovnako.

------------
IMHO to spravým obdobne akurát použijem onmouseover (nepoužívam klikací odkaz ako ste spomenuli vyžsie).
« 1 2 »
Toto téma je uzamčeno. Odpověď nelze zaslat.

0