nicht angemeldet
Bildmaße?
Hallo.
Ich habe eine Bildergallerie, in der ich oben eine Linkleiste und darunter ein Bild habe. Über die Linkleiste kann ich das Bild mit einem Javascript wechseln. (siehe URL)
function setpicture(index) {
picturename="ndesign";
document.screenshot.src = ""
if (index<"10") {document.screenshot.src = "../bilder/"+picturename+"0"+index+".jpg";}
if (index>="10") {document.screenshot.src = "../bilder/"+picturename+index+".jpg";}
}
Das Bild wird jedoch nicht an die neuen Maße des geladenen Bildes angepasst. Wie kann ich diese maße auslesen und dem Bild zuweisen?
-
Hi,
Das Bild wird jedoch nicht an die neuen Maße des geladenen Bildes angepasst. Wie kann ich diese maße auslesen und dem Bild zuweisen?
Breite und Höhe stehen dir in JS erst dann zur Verfügung, wenn der Browser das Bild (komplett) geladen hat. Dazu kannst du dich in das "onload"-Event des Bildes einklinken und die neuen .width und .height Eigenschaften abfragen. Du musst in diesem Fall aber nicht mit irgendwelchen "resize" Aktionen und Ereignisfunktionen oder ähnlichem arbeiten.
Das nicht-an-neue-Größe-anpassen-Problem besteht meisst, wenn du im <IMG>-Element der Seite schon die width und height Angaben stehen hast, z.B. beim Erstaufruf der Seite. Da du später nur die Quelle (src) austauschst, bleibten diese Werte auch im JS/DOM-Objekt bestehen.
"Korrekt" wäre es daher, das IMG-Objekt(!) ganz zu entfernen und neu einzufügen.
Dazu solltest du ein <div id="helferlein"> (oder span) um das eigentliche Bild legen, damit es im JS-Code schneller geht:<html>
<head>
<script language="JavaScript1.3" type="text/javascript">
function setpicture(index) {
var helfer = document.getElementById("helferlein");
var bild = document.images["screenshot"];
// man ist sich mal wieder nicht einig
if (bild.removeNode) bild.removeNode();
else if (helfer.removeChild) helfer.removeChild(bild);// neues IMG erstellen
bild = document.createElement("IMG");
bild.id = bild.name = "screenshot";picturename = "ndesign";
if (parseInt(index) < 10) {
bild.src = "../bilder/"+picturename+"0"+index+".jpg";
} else {
bild.src = "../bilder/"+picturename+index+".jpg";
}
// alert("Koräkt? " + bild.src)
// reinkleb
helfer.appendChild(bild);
}
</script>
</head>
</head>
<body>
<span onclick="setpicture(1)">1</span> |
<span onclick="setpicture(2)">2</span> |
<span onclick="setpicture(3)">3</span> |
<span onclick="setpicture(4)">4</span> |
<div id="helferlein"><img name="screenshot" id="screenshot" src="blank.gif" /></div>
</body>Ich hab den Script mit anderen Bildpfaden/-namen probiert und erst hier an deinen Script angepasst: teste also nochmal die Pfade und "index".
Viel Spaß,
CirTap--
You can have programs written fast, well, and cheap, but you only get to pick 2 ...
"Jeder der noch keinen Fehler gemacht hat, hat noch nie etwas Neues ausprobiert." (A. Einstein)-
noch ne noob-frage:
Wie bekomm ich es hin, das das Bild immer zentriert angezeigt wird?
ich bekomms net hin...
-