| Vorheriges Thema anzeigen :: Nächstes Thema anzeigen |
| Autor |
Nachricht |
gestaltvoll Gast
|
kleines bild anklicken ändert inhalt von iframe |
|
|
hallo zusammen!
folgendes problem:
auf einer seite möchte ich ein großes bild austauschen können.
unten ist eine leiste mit kleinen bildern, die beim klick darauf in groß an exakt der position des großen eben in groß dargestellt werden sollen.
unter mac / safari funktioniert die folgende kostruktion auch wunderbar.
unter windows mit explorer / avant / firefox leider nicht.
erster fehler: der iframe ist nicht zentriert auf der seite, obwohl im css an x stellen gesagt wird, er soll bitte zentriert sein. aber damit könnte ich leben. viel schlimmer: beim klick auf ein kleines bild öffnet es sich nur als großes, neues bild, der rest der seite verschwindet - toll!
hier der quelltext:
<div id="kopfbereich">
<h1>Canon PowerShot S70</h1>
<iframe id="hauptbild" src="Hauptbild01.html" frameborder="0" scrolling="no" height="400" width="100%"></iframe>
<a href="Hauptbild01.html" target="hauptbild">
<img src="Bild1.jpg" id="01" alt="Bild 1" width="70" border="0"/></a>
<a href="Hauptbild02.html" target="hauptbild">
<img src="Bild2.jpg" id="02" alt="Bild 2" width="70" border="0"/></a>
<a href="Hauptbild03.html" target="hauptbild">
<img src="Bild3.jpg" id="03" alt="Bild 3" width="70" border="0"/></a>
<a href="Hauptbild04.html" target="hauptbild">
<img src="Bild4.jpg" id="04" alt="Bild 4" width="70" border="0"/></a>
<a href="Hauptbild05.html" target="hauptbild">
<img src="Bild5.jpg" id="05" alt="Bild 5" width="70" border="0"/></a>
</div> <!-- ende kopfbereich -->
gibt es eine bessere, ohne iframe auskommende lösung?
oder irgend ein patch für die browser?
ratlos grüßend: gestaltvoll. |
|
|
|
| 28 Mai 2007 14:42 |
|
  |
drawnworld Mitglied

|
 |
|
|
Mir fallen nur Lösungen für PHP oder JavaScript ein...
PHP:
Das Bild als GET-Variable übermitteln. Dazu müssten die Links so aussehen:
| Code: | <a href="deineseite.php?img=bild.jpg" title="irgendein Titel...">...</a> |
Und deineseite.php muss ein etwa das beinhalten:
| Code: | <html>
<!-- <head>, <body> Ein bisschen was, was vor dem Bild kommt, etc., kennst du ja... -->
<img src="<?php
if(file_exists($_GET['img']))
{
echo $_GET['img'];
}
else
{
echo 'Standart-Bild.jpg';
}
?>"></img>
<!-- Der Rest von deinem Dokument... -->
</html> |
Die JavaScript-Variante ein anderes Mal, ich muss ins Bettchen ^^ |
_________________ www.nielshoppe.de |
|
|
| 28 Mai 2007 21:25 |
|
 |
Enni P Mitglied

|
 |
|
|
Anstatt
| Code: | <iframe id="hauptbild" src="Hauptbild01.html" frameborder="0" scrolling="no" height="400" width="100%"></iframe> |
würde ich eher
| Code: | <iframe name="hauptbild" src="Hauptbild01.html" frameborder="0" scrolling="no" height="400" width="100%"></iframe> |
verwenden. |
_________________ Endres
[ Mein Forum | Netzgemein.de Uploads ] |
|
|
| 31 Mai 2007 12:50 |
|
 |
V4hn Moderator
|
 |
|
|
| Enni P hat Folgendes geschrieben: | Anstatt
| Code: | <iframe id="hauptbild" src="Hauptbild01.html" frameborder="0" scrolling="no" height="400" width="100%"></iframe> |
würde ich eher
| Code: | <iframe name="hauptbild" src="Hauptbild01.html" frameborder="0" scrolling="no" height="400" width="100%"></iframe> |
verwenden. |
Nach XHTML-standard sollte man mit id arbeiten.
http://www.w3.org/TR/xhtml1/#h-4.10 |
_________________
 |
|
|
| 02 Jun 2007 17:45 |
|
 |
gestaltvoll Gast
|
vielen dank! |
|
|
liebe helfer, vielen dank für eure antworten.
derweil habe ich selbst die lösung gefunden:
man sollte name und id definieren, die beide gleich heißen müssen. dann klappt der wchesel mit allen browsern.
zum zentrierungsproblem:
iframe will sich nicht zentrieren.
dazu folgender trick: <p textalign="center"><iframe></ifram></p>.
das führt zum gewünschten ergebnis.
schönes wochenende, nina |
|
|
|
| 16 Jun 2007 10:59 |
|
 |
V4hn Moderator
|
Re: vielen dank! |
|
|
| gestaltvoll hat Folgendes geschrieben: | | man sollte name und id definieren, die beide gleich heißen müssen. dann klappt der wchesel mit allen browsern. |
>.<
Das ist ja schon Gewalt gegen die Standards...
Auch wenn es vielleicht funktioniert...
Beim Zentrieren tuen sich viele Browser wirklich sehr schwer...
Bei mir hat bis jetzt auch nur ein <center>-Tag den gewuenschten Effekt erzielt.
Falls du das ganze noch etwas komplexer umsetzen moechtest,
kannst du dir auch einmal die Diashow mit PHP und JavaScript ansehen,
die ich hier geschrieben hatte.
Solltest du die 'Shortcuts' dort auch brauchen, sag bitte Bescheid.
btw: 1.000 Beitrag in diesem Forum von meiner Seite  |
_________________
 |
|
|
| 16 Jun 2007 13:25 |
|
 |
|