PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : src in <img> ersetzen per Javascript


Gast
2011-06-01, 17:25:46
Hallo, ich habe folgendes Problem:

Auf einer Seite möchte ich ein Bild austauschen, so dass beispielsweise aus einem Pfeil ein anderer wird.

document.getElementById('q_8').src = "[...]";

Ich habe gelesen, dass die Seite erst komplett geladen werden muss, damit dies funktioniert; deswegen rufe ich meinen code auch in einer Funktion bei window.onload auf.

document.getElementById('q_8').style.display = "none";

funktioniert jedenfalls - hat jemand einen Tip, was ich machen muss?

Danke!

Gast
2011-06-01, 17:39:29
Je mehr ich lese, des do mehr wird

"document.getElementById('q_8').src = "[...]";"

als richtige Loesung angesagt. Aber es funktioniert bei mir nicht - leider aendert sich gar nichts!

Sephiroth
2011-06-01, 17:55:21
poste mal bitte dein kompletten code bzw. ein beispiel. und bitte den [code] oder [html] tag nutzen!

Gast
2011-06-01, 19:10:55
Das hier kommt in den Header:


<script type="text/javascript">

function test() {
document.getElementById('q_8').src = "http://meinemarkenmodede.plenty-test.de/images/gallery/layout/ebaypfeil2_winzig.png";
document.getElementById('q_7').src = "http://meinemarkenmodede.plenty-test.de/images/gallery/layout/ebaypfeil1_winzig.png";
}
window.onload = test;
</script>


Wenn ich etwas anderes mit dem Element mache, wie z.B. display=none setzen, dann funktioniert's.

Dreht es sich bei dem Thema vielleicht darum, dass man nach dem Laden keine Bilder mehr ersetzen kann?

InsaneDruid
2011-06-01, 19:21:40
.onload für Bildertausch ist Mist, da onload erst nach Laden aller Bilder ausgeführt wird. Daher wohl auch das Nichtfunktionieren.

Du könntest im Header einen script einbinden, der dem Element eine eigenständige css klasse zuweist, mit anderem Background image.

Sephiroth
2011-06-01, 20:04:26
.onload für Bildertausch ist Mist, da onload erst nach Laden aller Bilder ausgeführt wird. Daher wohl auch das Nichtfunktionieren.

Du könntest im Header einen script einbinden, der dem Element eine eigenständige css klasse zuweist, mit anderem Background image.
sollte aber trotzdem funktionieren

das Beispiel hier funktioniert ohne probleme mit IE9 und Firefox 3.6
<!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" dir="ltr" lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>img.src test</title>
<script type="text/javascript">
function test() {
document.getElementById('q_8').src = "http://meinemarkenmodede.plenty-test.de/images/gallery/layout/ebaypfeil2_winzig.png";
document.getElementById('q_7').src = "http://meinemarkenmodede.plenty-test.de/images/gallery/layout/ebaypfeil1_winzig.png";
}
window.onload = test;
</script>
</head>
<body>
<img src="http://www.3dcenter.org/images/3dc/de.png" id="q_7" />
<br />
<img src="http://www.3dcenter.org/images/3dc/gb.png" id="q_8" />
</body>
</html>