Hallo
ich habe ein kleines Problem mit den Attributen meiner Bilder.
Im header meiner html setze ich dieses Script
<script language="JavaScript">
<!--
onload = function(){
var bildurl1="www.url.de/bild1.jpg";
var bildurl2="www.url.de/bild2.jpg";
var bildurl3="www.url.de/bild3.jpg";
document.getElementById('Bildgross').setAttribute('src',bildurl1)
document.getElementById('Bild1').setAttribute('src',bildurl1)
document.getElementById('Bild2').setAttribute('src',bildurl2)
document.getElementById('Bild3').setAttribute('src',bildurl3)
}
und setze dann eine kleine Gallery mit einem grossen und 3 kleinen Vorschaubildern:
<img id="Bildgross" alt="Wenn Sie diesen Text lesen können, installieren Sie bitte das Java Plugin für Ihren Browser." style="border: 1px solid #000000;box-shadow: 5px 5px 10px lightblue; border-radius:10px" margin-buttom:15px;="" name="swap" height="240" width="300">
<img id="Bild1" ;="" alt="" style="margin-right: 1px;" onmousedown="change(1)" height="78" width="95">
<img id="Bild2" ;="" alt="" style="margin-right: 1px;" onmousedown="change(2)" height="78" width="95">
<img id="Bild3" ;="" alt="" style="margin-right: 1px;" onmousedown="change(3)" height="78" width="95">
mit onmousedown rufe ich noch folgende Funktion auf
<script type="text/javascript">
function change(number){
switch(number){
case 1:
document.getElementById('Bildgross').src = "www.url.de/bild1.jpg";
break;
case 2:
document.getElementById('Bildgross').src = "www.url.de/bild2.jpg";
break;
case 3:
document.getElementById('Bildgross').src = "www.url.de/bild3.jpg";
break;
}
}
</script>
Soweit klappt alles. Ich will aber in der Change function nicht
document.getElementById('Bildgross').src = "www.url.de/bild1.jpg";
stehen haben, sondern
document.getElementById('Bildgross').src = "bildurl1";
sodass ich bei neuen Bildern nicht immer den kompletten Code zweimal bearbeiten muss, sondern nur die URLs im header.
Aber egal, ob ich
document.getElementById('Bildgross').src = "bildurl1";
oder
document.getElementById('Bildgross').src = 'bildurl1';
oder
document.getElementById('Bildgross').src = bildurl1;
schreibe, es geht nie.
Auch ein neues Objekt mit
<img src="bildurl1" alt="">
würde ich mir wünschen, aber genau dasselbe Problem. Mit
<img src="www.url.de/bild1.jpg" alt="">
geht es natürlich wunderbar.
Wie muss / kann ich diese Variable schreiben, dass ich sie später als Quelle verwenden kann?
Ich habe zwar bereits gegoogelt wie blöde, aber es will irgendwie nie klappen.
Gruss
Björn
ich habe ein kleines Problem mit den Attributen meiner Bilder.
Im header meiner html setze ich dieses Script
<script language="JavaScript">
<!--
onload = function(){
var bildurl1="www.url.de/bild1.jpg";
var bildurl2="www.url.de/bild2.jpg";
var bildurl3="www.url.de/bild3.jpg";
document.getElementById('Bildgross').setAttribute('src',bildurl1)
document.getElementById('Bild1').setAttribute('src',bildurl1)
document.getElementById('Bild2').setAttribute('src',bildurl2)
document.getElementById('Bild3').setAttribute('src',bildurl3)
}
und setze dann eine kleine Gallery mit einem grossen und 3 kleinen Vorschaubildern:
<img id="Bildgross" alt="Wenn Sie diesen Text lesen können, installieren Sie bitte das Java Plugin für Ihren Browser." style="border: 1px solid #000000;box-shadow: 5px 5px 10px lightblue; border-radius:10px" margin-buttom:15px;="" name="swap" height="240" width="300">
<img id="Bild1" ;="" alt="" style="margin-right: 1px;" onmousedown="change(1)" height="78" width="95">
<img id="Bild2" ;="" alt="" style="margin-right: 1px;" onmousedown="change(2)" height="78" width="95">
<img id="Bild3" ;="" alt="" style="margin-right: 1px;" onmousedown="change(3)" height="78" width="95">
mit onmousedown rufe ich noch folgende Funktion auf
<script type="text/javascript">
function change(number){
switch(number){
case 1:
document.getElementById('Bildgross').src = "www.url.de/bild1.jpg";
break;
case 2:
document.getElementById('Bildgross').src = "www.url.de/bild2.jpg";
break;
case 3:
document.getElementById('Bildgross').src = "www.url.de/bild3.jpg";
break;
}
}
</script>
Soweit klappt alles. Ich will aber in der Change function nicht
document.getElementById('Bildgross').src = "www.url.de/bild1.jpg";
stehen haben, sondern
document.getElementById('Bildgross').src = "bildurl1";
sodass ich bei neuen Bildern nicht immer den kompletten Code zweimal bearbeiten muss, sondern nur die URLs im header.
Aber egal, ob ich
document.getElementById('Bildgross').src = "bildurl1";
oder
document.getElementById('Bildgross').src = 'bildurl1';
oder
document.getElementById('Bildgross').src = bildurl1;
schreibe, es geht nie.
Auch ein neues Objekt mit
<img src="bildurl1" alt="">
würde ich mir wünschen, aber genau dasselbe Problem. Mit
<img src="www.url.de/bild1.jpg" alt="">
geht es natürlich wunderbar.
Wie muss / kann ich diese Variable schreiben, dass ich sie später als Quelle verwenden kann?
Ich habe zwar bereits gegoogelt wie blöde, aber es will irgendwie nie klappen.
Gruss
Björn
Zuletzt bearbeitet: