Autor Zpráva
unlucky
Profil
mam
.x{
  background: url("../images/x.png") no-repeat center bottom;
}
.x:hover{
  background: url("../images/y.png") no-repeat  center bottom;
}

Kazdy obrazek ma cca 80kb
Kdyz tam najedu mysi, tak se stane:
x... na 0.2 sec nic... pak y
Kdyz dam refresh nebo kdyz stranku navstivim po druhe, tak uz to funguje normalne. Muze to byt kvuli vyssi velikosti obrazku? Zkousel jsem to i s mensimi obrazky a obcas se mi porad toto stava.
panther
Profil
unlucky:
Zkousel jsem to i s mensimi obrazky a obcas se mi porad toto stava.
platí to pro všechny obrázky. Obrázek y.png se začne stahovat až v momentě, kdy je potřeba. Čím je větší, tím to trvá déle.

Klíčové slovo pro tebe bude CSS sprite.
unlucky
Profil
dekuji.

Lze tento problem vyresit pomoci javascriptu nebo onmouseout on?
Chamurappi
Profil
Reaguji na unluckyho:
Lze ho vyřešit přednačtením a je jedno, jestli pomocí JavaScriptu, nebo pomocí CSS. Samotný onmouseover nic neřeší.
panther
Profil
unlucky:
při onmouseout už je trochu pozdě, nemyslíš?

Možná by šel obrázek nějak preloadovat, ale řešení v CSS se spritem je obvyklé a čisté.
Tremono
Profil
unlucky:
Co třeba vložit někam na konec kódu něco jako:
<img style="display:none;" src="y.png" />
nebo
<img style="width:0;height:0;" src="y.png" />

Obrázek se stáhne, aniž se zobrazí, a pak při :hover bude připravený. ;)

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: