this.style.backgroundImage

[Christian]

hi,
ich habe da ein problem mit dem austauschen von hintergrundbildern bei Tabellenzeilen.
ich möchte die Bilder zuerst vorladen. das (versuche) mache ich mit:

var bgImg = new Array();
bgImg[0] = new Image(); bgImg[0].src = "nav_field.gif";
bgImg[1] = new Image(); bgImg[1].src = "nav_field_active.gif";

jetzt hörts auch schon auf denn ich weiss nicht wie ich weiter auf die bilder zugreifen kann. mit:

<tr OnMouseOver="this.style.backgroundImage=url('document.Images[0].src = bgImg[1].src')" OnMouseOut="this.style.backgroundImage=url('document.Images[0].src = bgImg[0].src')" OnClick="load('body.html')" style="background-image: url(nav_field.gif); background-repeat: no-repeat; background-attachment: fixed; background-position: center; ">

gehts auf jeden fall nicht und mit:

<tr  OnMouseOver="this.style.backgroundImage='url(nav_field_active.gif)'" OnMouseOut="this.style.backgroundImage='url(nav_field.gif)'" OnClick="load('buecher.html')" style="background-image: url(nav_field.gif); background-repeat: repeat; background-attachment: fixed; background-position: center; ">

greife ich ja nicht auf die vorgeladenen zurück.

schön wäre eine lösung mit dem schlüsselwort "this."

[wahsaga]

hi,

mit:
<tr OnMouseOver="this.style.backgroundImage=url('document.Images[0].src = bgImg[1].src')" ...>
gehts auf jeden fall nicht

klar, warum sollten in dem _string_ 'document.Images[0].src = bgImg[1].src' denn auch variablen erkannt werden.

und mit:
<tr  OnMouseOver="this.style.backgroundImage='url(nav_field_active.gif)'" ...>
greife ich ja nicht auf die vorgeladenen zurück.

wie kommst du darauf?

wenn ein bild einmal im cache ist, wird der browser es von dort nehmen; auf welche weise es in den cache hineingeladen wurde, und wie es jetzt "aufgerufen" wird, ist dabei unerheblich.

gruss,
wahsaga

[Christian]

uahh.... erst mal herzlichen dank das du noch geantwortest hast ich war mir schon fast sicher das darauf wohl keiner mehr antworten wird.

aber werden die bilder mit

bgImg[0] = new Image(); bgImg[0].src = "nav_field.gif";

nicht in den speicher geladen? ich meine damit das ich zumindest glaube, das wenn ich die bilder mit

bgImg[0] = new Image(); bgImg[0].src = "nav_field.gif";

lade der bildwechsel schneller geht, da ich die

OnMouseOut="this.style.backgroundImage='url(nav_field.gif)'"

version bereits auf meiner seite habe und die hängt ziemlich, obwohl ich zu dem server eine 100mbit leitung habe.

ich würde das andere gerne mal austesten aber habe leider keine ahnung wie ich auf die bilder zugreifen kann, wenn es da eine lösung gibt und du sie weisst kannst du sie mir vielleicht schreiben?

[wahsaga]

hi,

uahh.... erst mal herzlichen dank das du noch geantwortest hast ich war mir schon fast sicher das darauf wohl keiner mehr antworten wird.

nach einer stunde schon? geduld scheint nicht deine stärke zu sein ...
hier werden fragen teilweise auch nach tagen noch beantwortet.

aber werden die bilder mit
bgImg[0] = new Image(); bgImg[0].src = "nav_field.gif";
nicht in den speicher geladen?

das habe ich nicht sagen wollen.
dein zuerst geposteter code war aber fehlerhaft, deshalb wurde mit _diesem_ auch nichts vorgeladen.

ich würde das andere gerne mal austesten aber habe leider keine ahnung wie ich auf die bilder zugreifen kann, wenn es da eine lösung gibt und du sie weisst kannst du sie mir vielleicht schreiben?

im netz findest du zahlreiche beispiele, wie man sowas umsetzen kann, http://www.google.com/search?q=bilder+vorladen&sourceid=opera&num=0&ie=utf-8&oe=utf-8.

gruss,
wahsaga

[Christian]

hi,

ok ich hab eine lösung (hängt aber genauso!!!):

<script type="text/JavaScript">
<!--
var bgImg = new Array();
bgImg[0] = new Image(); bgImg[0].src = "nav_field.gif";
bgImg[1] = new Image(); bgImg[1].src = "nav_field_active.gif";

function change_img(line,img)
   {
   line.style.backgroundImage="url("+bgImg[img].src+")";
   }
//-->
</script>

---------------------------------

<tr OnMouseOver="change_img(this,'1')" OnMouseOut="change_img(this,'0')">