Autor Zpráva
Majlo
Profil *
#1 · Zasláno: 15. 12. 2005, 17:20:10
Odpovědět Citovat
Zdavim vsechny,
potreboval bych poradit, jak mam zmenit pozadi v elementu (napriklad v divu) moci javasciptu a obrazku, ktery mam natazeny v pameti. Trocha kodu pro pochopeni

v html mam:
<div id="pokus">nejaky text</div>

a pak v kodu js mam

obrazek = new Image(); obrazek.src = "obrazek.jpg";
document.getElementById("pokus") (sem neco doplnit nebo udelat, tak aby) = eval(obrazek.src);

kdyby id=pokus byl img, tak by kod vypadal nejak takto
document.images["pokus"].src = eval(obrazek.src);

a to chci ale pro pozadi elementu a ne obrazku. Na netu jsem nasel pouze odkazy, ze document.getElementById("pokus").style.backgroundImage = 'url(obrazek.jpg)';
coz neni ono, protoze to porad taha a pokud je obrazek moc velky, blika.

Doufam, ze jste z meho zmateneho popisu pochopili, co chci. Dekuji za kazdou radu.

Majlo
peta
Profil *
#2 · Zasláno: 15. 12. 2005, 19:32:32
Odpovědět Citovat
document.getElementById("pokus").style.backgroundImage = 'url(obrazek.jpg)';

nema proc blikat a tahat, jsi nedal webku na test, tve minus. kdyz si budu chtit hrat, tak si to cely musim napsat. A na to jsem linej :)

Predevsim zapomen na eval(obrazek.src) . Nechapu, proc to mas. Bud si udelam pole obrazek[0] , obrazek[1]... nebo vice promennych obrazek0, obrazek1 ... Coz je totez.

pak do ='url('.obrazek.src.')';

Mno, a chyba tahani, nemas to ty nejak silene zacyklene nebo nespravne napsane backgroun-position? zkus tam dat 0 0 .
Majlo
Profil *
#3 · Zasláno: 16. 12. 2005, 09:02:09
Odpovědět Citovat
Peto diky,
mas pravdu jak s eval, tak s problikavanim. Kopiroval jsem to z kodu, tak jsem to zapomel smazat. Podle uvah by problikavani nemelo byt, ale bohuzel v IE se tak deje. Na netu to zatim neni umistene, takze nemuzu dat odkaz.
Potrebuju udelat preloader, abys to lepe pochopil, zverejnim vetsi cast kodu:

<html>
<head>
<script language="JavaScript" type="text/JavaScript">
<!--
var otherImagesDone = false;
function OtherImages() {
img11 = new Image(); img11.src = "menu.jpg";
img12 = new Image(); img12.src = "menu_over.jpg";
bg11 = new Image(); bg11.src = "menubg.png";
bg12 = new Image(); bg12.src = "menubg_over.png";
otherImagesDone = true;
}

function hiLite( imgDocID, imgObjName ) {
if( otherImagesDone ) document.images[imgDocID].src = eval(imgObjName + ".src");
}

function hiLite2( imgDocID, imgObjName ) {
if( otherImagesDone ) document.getElementById(imgDocID).style.backgroundImage = 'url("'+eval(imgObjName + ".src")+'")';
}
//-->
</script>

</head>

<body onLoad="OtherImages();">
<!-- tento obrazek je ok, vse vporadku po natazeni se obrazek po najeti meni -->
<a href="" onmouseover="hiLite('img1, 'img12');" onmouseout="hiLite('img1', 'img11');">
<img src="menu.jpg" name="img1">
</a>

<!-- po najeti na odkaz se zmeni pozadi divu, ale v IE problikava. Obrazek neni zas tak velky, aby to delalo nejaky caviky. -->
<div id="bg1">
<a href="" class="menu_tlacitko" id="menu1" onmouseover="hiLite2('bg1', 'bg12');" onmouseout="hiLite2('bg1', 'bg11');">
polozka
</a>
</div>
</body>
</html>


Ted to trochu popisu. Pri nacteni stranky se pomoci onload v body spusti preload. Mel by natahnout vsechny obrazky do pameti pak nastavit otherImagesDone na true. A kdyz najedu na odkazy, tak se melo menit pozadi. Pokud se jedna o img, vse funguje jak ma (uz to mam otestovano na par webech), ale jakmile se jedna o obrazek na pozadi divu (prvne zkousim), tak mi v IE problika barva pozadi (tu barva body) a u kurzoru mysky se obcas objevi presypaci hodiny, coz neni dobry.
Zkusi mi nekdo poradit, jak udelat preloader, tak aby fungoval na pozadi divu v IE? Diky.
peta
Profil *
#4 · Zasláno: 16. 12. 2005, 09:38:53
Odpovědět Citovat
Majlo Ahaaaa. Co ti poblikava a ona barva. To proto, ze to skutecne nema natazeno, pripadne IE zlobi, kdyz menis barvu a pozadi. Proste IE a cache.

Resil bych to tak, ze si dopredu dam obrazky do style a na stranku dam prvky treba 10x10 px s parametrem visibility:hidden (abych mel jistotu, ze se styl aplikuje a obrazek natahne) a pak jenom menil className u pozadi. Class se mohou scitat "pozadi cislo1" "pozadi cislo2"
.pozadi {...}
.x {visibility:hidden}
.cislo1 {background-image:url()}
.cislo2 {background-image:url()}
Nebo vyuzivas ID, tak ti staci class jeden.
<div id="pozadi" class="cislo1">
<div class="x cislo1">
<div class="x cislo2">
A neresil JS.
Samozrejme ty prvky muzes vytvorit JS, ale pokud to neni treba, nedelam to.
Časová prodleva: 3 dny
Majlo
Profil *
#5 · Zasláno: 19. 12. 2005, 09:46:06
Odpovědět Citovat
Toto reseni me vubec nenapadlo a je velice elegantni. Hned to pouziju. Peto, diky.
Časová prodleva: 21 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0