Autor Zpráva
jullin
Profil
#1 · Zasláno: 19. 6. 2012, 17:15:34 · Upravil/a: jullin o 9 minut později
Odpovědět Citovat
Dobrý den mám takový menší problém s příkazy onmouseout a onmouseover. Úplně bez problému se mi to chová pouze v Mozzile(v13). V Opeře (v12) se to chová tak na půl správně. Obrázky se sice při přejetí myši změní, ale je to doprovázeno takovým zvláštním probliknutím daného obrázku. A dále v IE (v9) se to nechová nijak, resp. Jakoby ty příkazy vůbec nepodporoval. Nevíte někdo co s tím?


Zde je kód: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<style type="text/css">
.auto-style1 {
    width: 100%;
    height: 100%;
}
</style>
<title>Bigg balls</title>
 
<script type="text/javascript">
if (document.images) {
    img1 = new Image();
    img1.src = "images/pravejhorni2.png";
    img2 = new Image();
    img2.src = "images/pravejdolni2.png";
    img3 = new Image();
    img3.src = "images/levejdolni2.png";
    img4 = new Image();
    img4.src = "images/levejhorni2.png";


}
</script>    
  
</head>
 
 
<body bgcolor="#000000">

<img alt="" class="auto-style1" src="Images/main%20obrázek.png" style="z-index: 0; position: absolute; top: 0%; left: 0%" />&nbsp;

<a href="default.html"><img src="images/pravejhorni1.png" style= "z-index: 4; position: absolute; top: 31.25%; left: 50.04%; width: 14.5%; height: 28%;" onmouseover="this.src='images/pravejhorni2.png'" onmouseout="this.src='images/pravejhorni1.png'"/></a>

<a href="default.html"><img src="images/pravejdolni1.png" style= "z-index: 3; position: absolute; top: 59%; left: 50%; width: 14.5%; height: 28%;" onmouseover="this.src='images/pravejdolni2.png'" onmouseout="this.src='images/pravejdolni1.png'"/></a>

<a href="default.html"><img src="images/levejdolni1.png" style= "z-index: 2; position: absolute; top: 58.7%; left: 35.57%; width: 14.5%; height: 28%;" onmouseover="this.src='images/levejdolni2.png'" onmouseout="this.src='images/levejdolni1.png'"/></a>

<a href="default.html"><img src="images/levejhorni1.png" style= "z-index: 1; position: absolute; top: 31.4%; left: 35.52%; width: 14.6%; height: 27.5%;" onmouseover="this.src='images/levejhorni2.png'" onmouseout="this.src='images/levejhorni1.png'"/></a>

</body>

</html>

"A dále v IE (v9) se to nechová nijak, resp. Jakoby ty příkazy vůbec nepodporoval" - toto vyřešeno. Není podporováno.
MyFlower
Profil
#2 · Zasláno: 22. 6. 2012, 02:47:18
Odpovědět Citovat
Probliknutí nejspíš budete mít způsobené tím, že pouze vyměňujete cestu k obrázku. Ten však ještě není nacachovaný v prohlížeči a musí se stáhnout - zde dojde ke krátké prodlevě mezi "odstraněním" starého obrázku a načtením nového. Nejoptimálnější cestou je mít obrázky uložené "vedle sebe" v jednom .png souboru, načítat je např do <div> a onmouseover měnit jejich parametr pozice pozadí v CSS. Na internetu je spousta příkladů :-)
margin
Profil *
#3 · Zasláno: 22. 6. 2012, 05:47:53
Odpovědět Citovat
MyFlower:
„ještě není nacachovaný v prohlížeči a musí se stáhnout“
Obrázky by měl být načtené, je to na řádcích 15 až 23.

jullin:
Dej odkaz na živou ukázku.
_es
Profil
#4 · Zasláno: 22. 6. 2012, 06:31:54 · Upravil/a: _es o 9 minut později
Odpovědět Citovat
jullin:
Prečo majú obrázky absolútne pozicovanie a rozmery v percentách? Možno to súvisí s tým.
jullin
Profil
#5 · Zasláno: 22. 6. 2012, 14:55:11 · Upravil/a: jullin 22. 6. 2012, 18:39:24
Odpovědět Citovat
Tu je odkaz na živou stránku. Je tam zatím jen jeden z těch tří, ale dělá to samé. : http://biggballs.clanweb.eu/
Dále obrázky by měli být právě že už načtené viz : 
<script type="text/javascript">
if (document.images) {
    img1 = new Image();
    img1.src = "images/pravejhorni2.png";
    img2 = new Image();
    img2.src = "images/pravejdolni2.png";
    img3 = new Image();
    img3.src = "images/levejdolni2.png";
    img4 = new Image();
    img4.src = "images/levejhorni2.png";
 
 
}
</script>

A co se týče těch procent tak to je kuli tomu aby se obrázky přizpůsobovali rozlišení obrazovky :)
Časová prodleva: 12 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0