Supportnet / Forum / Skripte(PHP,ASP,Perl...)
Bilder in Frame anzeigen
Frage
Hi Leute!
Ich wollte wieder einmal ein wenig JavaScript üben und bin jetzt auf folgenden Problem gestossen:
Ich habe ein Fenster mit zwei Frames. Auf der linken Seite ist ein Menü mit Links. Die Links alle auf Bilder. Jetzt möchte ich es so haben, dass wenn ich auf ein Bilder, klicke, dass dieses dann im anderen Frame dargestellt wird.
Ich weiss, dass man mit [b] this.name[/b] den Namen des Links irgendwie auslesen kann und mit [b] document.write(´<img src="[/b]... ein Bild einbetten kann.
Aber weiter weiss ich nicht.
Wäre sehr dankbar für jede Hilfe!
Gruss mneha
Antwort 1 von rfb
am einfachsten:
<a href="bild.jpg" target="andererFrame" type="image/jpeg">Bild-Link-Text</a>
Antwort 2 von mneha
Ja, das hab ich auch gerade entdeckt. Aber es wäre schöne, wenn das Bild schön zentriert (horizontal und vertikal) wäre im anderen Frame.
Kannst du mir da auch weiterhelfen?
Danke!
Gruss mneha
Kannst du mir da auch weiterhelfen?
Danke!
Gruss mneha
Antwort 3 von rfb
<a href="bild.jpg" target="andererFrame" type="image/jpeg" onclick="anzeige(this.href);">Bild-Link-Text</a>
function anzeige(bild) {
var wo=parent.frames["andererFrame"].document..getElementsByTagName("body")[0]
wo.style.backgroundImage=bild;
wo.style.backgroundRepeat="no-repeat";
wo.style.backgroundPosition="center center";
}
das setzt eine halbwegs leere HTML-Datei in "andererFrame" voraus. background-Bilder lassen sich noch am einfachsten zentrieren.
Habs nicht ausprobiert - viel Glück dabei.
function anzeige(bild) {
var wo=parent.frames["andererFrame"].document..getElementsByTagName("body")[0]
wo.style.backgroundImage=bild;
wo.style.backgroundRepeat="no-repeat";
wo.style.backgroundPosition="center center";
}
das setzt eine halbwegs leere HTML-Datei in "andererFrame" voraus. background-Bilder lassen sich noch am einfachsten zentrieren.
Habs nicht ausprobiert - viel Glück dabei.
Antwort 4 von rfb
hoppla, da fehlt ein ; hinter ("body")[0]
Antwort 5 von mneha
Aha, klingt sehr gut!
Ist mir fast peinlich, aber wo kommt das hin?
Also der function-Teil?
Gruss mneha
Ist mir fast peinlich, aber wo kommt das hin?
Also der function-Teil?
Gruss mneha
Antwort 6 von rfb
in den head-Bereich der Menü-Seite:
<doctype ...>
<html>
...
<title>...</title>
<script type="text/javascript">
<!--
function ...
...
//-->
</script>
</head>
<body>
...
<doctype ...>
<html>
...
<title>...</title>
<script type="text/javascript">
<!--
function ...
...
//-->
</script>
</head>
<body>
...
Antwort 7 von mneha
Also bei mir sieht das ganze jetzt so aus:
<head>
<title>blabla</title>
<style type="text/css">
a:link { font-weight:normal; color:#3e54cb; text-decoration:none }
a:visited { font-weight:normal; color:#3e54cb; text-decoration:none }
a:hover { font-weight:normal; color:#3e54cb; text-decoration:underline }
a:active { font-weight:normal; color:#3e54cb; text-decoration:none }
a:focus { font-weight:normal; color:#3e54cb; text-decoration:none }
</style>
<script language="JavaScript" type="text/javascript">
function anzeige(bild) {
var wo=parent.frames["foto_anzeige"].document..getElementsByTagName("body")[0];
wo.style.backgroundImage=bild;
wo.style.backgroundRepeat="no-repeat";
wo.style.backgroundPosition="center center";
}
</script>
</head>
.
.
.
<a href="text.jpg" target="foto_anzeige" onclick="anzeige(this.href);">Bild 1</a>
Aber es funktioniert leider noch nicht.
Du hast geschrieben: var wo=parent.frames["foto_anzeige"].document..getElementsByTagName("body")[0]; . Braucht es da wirklich zwei Punkte nach document?
<head>
<title>blabla</title>
<style type="text/css">
a:link { font-weight:normal; color:#3e54cb; text-decoration:none }
a:visited { font-weight:normal; color:#3e54cb; text-decoration:none }
a:hover { font-weight:normal; color:#3e54cb; text-decoration:underline }
a:active { font-weight:normal; color:#3e54cb; text-decoration:none }
a:focus { font-weight:normal; color:#3e54cb; text-decoration:none }
</style>
<script language="JavaScript" type="text/javascript">
function anzeige(bild) {
var wo=parent.frames["foto_anzeige"].document..getElementsByTagName("body")[0];
wo.style.backgroundImage=bild;
wo.style.backgroundRepeat="no-repeat";
wo.style.backgroundPosition="center center";
}
</script>
</head>
.
.
.
<a href="text.jpg" target="foto_anzeige" onclick="anzeige(this.href);">Bild 1</a>
Aber es funktioniert leider noch nicht.
Du hast geschrieben: var wo=parent.frames["foto_anzeige"].document..getElementsByTagName("body")[0]; . Braucht es da wirklich zwei Punkte nach document?
Antwort 8 von rfb
Zitat:
Braucht es da wirklich zwei Punkte nach document?
nö (typischer Kopierfehler meinerseits ;-)Braucht es da wirklich zwei Punkte nach document?
ansonsten: wenn du zufällig Mozilla/Firefox zur Hand hast - lade mal die Seite, führ mal den Link aus und tippe dann "javascript:" in die Adresszeile. Es erscheint dann ein kleines Fenster mit Fehlermeldungen. Evtl. hier posten...
Antwort 9 von mneha
Also erstmal, das mit dem Ausführen des Scripts und dann in der Befehlszeile "Javascript:" eintippen, ging nicht.
Und um es nochmal genau zu sagen, ich möchte, dass wenn ich auf einen zu einem Bilder verweisenden Link klicke, dann im anderen Frame das Bild erschein, und zwar zentriert im Frame.
Bis jetzt erscheint das Bild, jedoch nicht zentriert und die Scripts, die ich von rfb erhalten habe, weisen keine Fehler auf, jedoch funktionieren sie nicht.
Gruss mneha
Und um es nochmal genau zu sagen, ich möchte, dass wenn ich auf einen zu einem Bilder verweisenden Link klicke, dann im anderen Frame das Bild erschein, und zwar zentriert im Frame.
Bis jetzt erscheint das Bild, jedoch nicht zentriert und die Scripts, die ich von rfb erhalten habe, weisen keine Fehler auf, jedoch funktionieren sie nicht.
Gruss mneha
Antwort 10 von rfb
das mit dem javascript: in der Adresszeile klappt auch nur bei Firefox&Co.
Tja, so ohne weiteres fällt mir momentan auch nichts weiter ein - keine Ahnung, warum das Script nicht werkt.
Aber da ich von Javascript-Lösungen an sich sowieso nicht so viel halte, kann ich dir jetzt besten Gewissens raten: pack die Bilder in HTML-Seiten, füge eine nette Beschreibung bei und zentrier das ganze per CSS nach Gutdünken.
Tja, so ohne weiteres fällt mir momentan auch nichts weiter ein - keine Ahnung, warum das Script nicht werkt.
Aber da ich von Javascript-Lösungen an sich sowieso nicht so viel halte, kann ich dir jetzt besten Gewissens raten: pack die Bilder in HTML-Seiten, füge eine nette Beschreibung bei und zentrier das ganze per CSS nach Gutdünken.
Antwort 11 von mneha
:D
Das hab ich jetzt auch gemacht. Aber ich überlege mir immer, was ist, wenn ich 10´000 Bilder habe??? Dann ist es schon ein wenig mühsam, für jedes Bild eine HTML-Seite zu erstellen. Geht das vielleicht mit PHP, VBS usw.? Davon hab ich zwar weniger Ahnung.
Gruss mneha
Das hab ich jetzt auch gemacht. Aber ich überlege mir immer, was ist, wenn ich 10´000 Bilder habe??? Dann ist es schon ein wenig mühsam, für jedes Bild eine HTML-Seite zu erstellen. Geht das vielleicht mit PHP, VBS usw.? Davon hab ich zwar weniger Ahnung.
Gruss mneha