Popup
Nils
- javascript
0 Patrick0 Daniel Thoma
Hi. Ich suche eine Möglichkeit Bilder in Kleinformat per Linksklick in einem neuen Fenster zu öffnen. Das neue Fenster sollte sich der genauen Bildgrösse automatisch anpassen.
Freue mich auf eine Antwort.
MfG
Nils
Hallo Nils!
Hi. Ich suche eine Möglichkeit Bilder in Kleinformat per Linksklick in einem neuen Fenster zu öffnen. Das neue Fenster sollte sich der genauen Bildgrösse automatisch anpassen.
Einer meiner Lieblingslinks: http://www.netz-notizen.de/javascript/tipps/image.htm
Funktioniert mit Opera allerdings nicht, weil er mit window.open("",....) oder window.open("about:blank",...) nichts anfangen kann.
Patrick
Hallo Nils
Ich hatte gerade etwas Zeit und hab deswegen ausnamsweise ein
komplettes Script geschrieben:
tets.html (die seite mit den kleinen Bildern):
<html>
<head>
<title>test</title>
<script>
var extension = "big";
var fenster = null;
function popup(bild) {
var tokens = bild.src.split(".");
var bbild = new Image();
bbild.src = tokens.slice(0,tokens.length - 1).join(".") + "." + extension + "." + tokens[tokens.length - 1];
if(fenster != null && !fenster.closed) fenster.close();
fenster = open("popup.html?" + bbild.src,"popup","height=" + bbild.height + ", width=" + bbild.width);
}
</script>
</head>
<body>
<a href="#" onclick="popup(document.bild1)"><img name="bild1" border="0" src="test.gif"></a><br>
<a href="#" onclick="popup(document.bild2)"><img name="bild2" border="0" src="test2.gif"></a>
</body>
</html>
popup.html (die Seite für das Popupfenster)
<html>
<head>
<title>popup</title>
</head>
<body>
<script>
var url = window.location.href.split("?");
document.open();
document.write("<img style="position:absolute; top:0px; left:0px" src="" + url[1] + "">");
document.close();
</script>
</body>
</html>
Die großen Bilder müssen in dem Fall test1.big.gif und test2.big.gif heißen.
Im Mozilla und im IE hab ich das Script getestet. Wenn es irgendwo
nicht tun sollte, kann man eventuell noch mit window.resizeTo()
arbeiten.
Viel Spass beim Verstehen ;-)
Grüße
Daniel
Hallo
Ich habe das Script nochmal überarbeitet und poste es hier mal für's archiv:
popup.html
<html>
<head>
<title>popup</title>
<script>
function resize() {
window.resizeTo(document.bild.width, document.bild.height);
}
</script>
</head>
<body>
<script>
var url = window.location.href.split("?");
document.open();
document.write("<img name="bild" style="position:absolute; top:0px; left:0px" src="" + url[1] + "" onLoad="resize()">");
document.close();
</script>
</body>
</html>
test.html
<html>
<head>
<title>test</title>
<script>
var extension = "big";
function popup(bild) {
var tokens = bild.src.split(".");
var bbild = tokens.slice(0,tokens.length - 1).join(".") + "." + extension + "." + tokens[tokens.length - 1];
var win = open("popup.html?" + bbild,"popup","menubar=no,resizable=no,status=no,locationbar=no,height=200,width=200");
win.focus();
}
</script>
</head>
<body>
<a href="#" onclick="popup(document.bild1); return false"><img name="bild1" border="0" src="test.gif"></a><br>
<a href="#" onclick="popup(document.bild2); return false"><img name="bild2" border="0" src="test2.gif"></a>
</body>
</html>
Die letzte Version war nicht ganz zuverlässig.
Gruß
Daniel