• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Dynamisches Iframe

F

[email protected]

Neues Mitglied
Hi Leute,
hab noch ne Frage^^
Ich möchte ein Bild in einem Iframe laden, ist es möglich das sich das Bild an das Iframe anpasst? Ich hab das mal geschafft, hab jedoch vergessen wie, und die Seite bei der ich das damals gemacht, ist offline und die dateien auf meinem pc find ich nicht mehr, hat jemand ne Idee wie das funktioniert?
lg Chris
 
Mein bisheriger Code
<iframe src="Modelle/Waffen/M4A1/M4A1.jpg" style="border:0px #FFFFFF none;" name="myiframe" scrolling="no" frameborder="0" align=aus marginheight="0px" marginwidth="0px" height="144" width="192"></iframe>
Nur kein Plan wie ich das Bild im Iframe verkleinert darstellen soll :(
 
Hallo,

wenn im iFrame eine HTML-Seite mit img-Tag geladen wird, kannst du diesem Element eine volle Breite und Höhe geben.
seite.html
HTML: 
[...]
<iframe src="iframe.html" width="500" height="300"></iframe>
[...]
iframe.html
HTML: 
<!doctype html>
<html>
	<head>
		<style type="text/css"> *{margin:0;padding:0;} </style>
	</head>
	<body>
		<img src="bild.png" width="100%" height="100%" />
	</body>
</html>


Gruß

Edit: Es ist jedoch auch nicht von Nachteil, das Bild passend zurecht zuschneiden. ;)
 
leider muss ich dafür aber für jedes bild ne neue iframe seite machen, geht das nicht auch einfacher?meine bilder haben alle breite 640 höhe 480 und müssen auf breite 192 höhe 144, opera macht das z.b. automatisch
 
Mit etwas PHP-Kunst lässt sich iframe.html dynamisieren.

iframe.php (PHP-Endung!)
HTML: 
<!doctype html>
<html>
	<head>
		<style type="text/css"> *{margin:0;padding:0;} </style>
	</head>
	<body>
		<img src="<?php echo $_GET['bild']; ?>" width="100%" height="100%" alt="" />
	</body>
</html>

Aufgerufen durch:
HTML: 
<iframe src="iframe.php?bild=ordner/bild_bla.png" width="500" height="300"></iframe>

Wenn du die Bilder verkleinern würdest, würde auch nicht so viel Traffic auf deinem Server entstehen.


Aber mal eine andere Frage:
Warum bindest du die Bilder nicht direkt mit dem img-Tag ein? (Ließe sich auch mit deiner JavaScript-Auswahlliste vereinigen. ;))
 
Versuche das mal [ungetestet]:
HTML: 
<select onchange="document.getElementById('bildWaffe').src=this.options[this.selectedIndex].value">
	<option value="#">Bitte w&auml;hlen</option>
	<option value="bild1.png">Waffe 1</option>
	<option value="bild2.png">Waffe 2</option>
	<option value="Modelle/Waffen/M4A1/M4A1.jpg">Waffe 3</option>
</select>

<p style="text-align: center;">
	<img id="bildWaffe" src="Modelle/Waffen/M4A1/M4A1.jpg" style="border: 0 none;" height="144" width="192" />
</p>
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben