✔ Links in iframe auf Grafik....

Status
Nicht offen für weitere Antworten.
dennis-sauer

dennis-sauer

Erfahrenes Mitglied
Guten abend zusammen,

ich sitze derzeit an einer etwas komplexeren Seite dran und bin derzeit ein wenig am rätseln. Ich habe eine Grafik auf dieser befinden sich Links. Mit einem Klick auf einen Link (So war es bisher) hat sich eine Seite in einem iframe auf der Grafik geöffnet. Den iframe habe ich mithilfe eines div Tags auf die Grafik bekommen. Der alte Hintergrund war einfarbig nun ist es Bild. Gibt es noch eine andere Möglichkeit "Unterpunkte" anzeigen zu lassen?

Als kleines Anhängsel und zum besseren Verständnis

http://www.ds1603.de/test/home.html

Danke im voraus

Dennis
 
Eine verweis-sensitive Grafik (= ImageMap) kann keine Submenüs (= Unterpunkte) enthalten.

Oder was ist dein Anliegen? Deine Beschreibung ist nämlich alles andere als verständlich.
 
Hallo,

ja genau deswegen habe ich ja den Link mit angebracht, da es nicht einfach ist das zu beschreiben.

1. Eine html Seite mit drei Tabellen (zentriert) und jeweils einem Bild
2. Ein div-Tag positioniert (da hab ich noch das Problem das sich der div-Tag bei ner anderen Auflösung verschiebt) in diesem div-Tag befindet sich ein iframe
3. Beim Klick auf die oberen Navigationspunkte soll sich eine Seite im iframe öffnen

Problem: Ich habe ein Hintergrundbild und die Seite die sich im iframe öffnet stellt es standardmäßig weiß dar.

Wie es hinterher aussehen soll (nur jetzt mit HG-Bild) könnt ihr hier sehen.

Gruß

Dennis
 
Naja....beim IE kann man ein iFrame transparent machen.
Ansonsten.... da das ja alles fixe Grössen sind, sollte es gutt möglich sein, das selbe Hintergrundbild im iFrame zu platzieren, dass es passt.
Damit er nicht scrollt, fixierst du den Hintergrund dann noch per CSS:
background-attachment:fixed
 
Hallo,

ok das wird dann wohl mein nächster Angriff sein...

Derzeit sitze ich an der Lösung mit mehreren div-Tags.

Ein mit dem Bild und darüber einer für die Navigation. Klappt auch alles im IE und FF wunderbar auch mit dem transparenten Hintergrund. Allerdings macht der FF Probleme mit der zentrierten Position, weiß jemand woran das liegen könnte?

Hier mal der Quelltext

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>Unbenanntes Dokument</title>
 <link href="styles.css" rel="stylesheet" type="text/css" />
 <style type="text/css">
 img {
 behavior: url("pngbehavior.htc");}
 
 #navigation {
 	width:200px;
 	height:25px;
 	z-index:2;
 }
 	
 #oben {
 	visibility:visible;
 	width: 800px;
 	height: 600px;
 	z-index:1;}
 
 	
 </style>
 </head>
 
 <body topmargin="100" marginheight="100">
 
 <div id="oben" style="margin:auto">
 
 <img src="graphics/backgrounds/home_01.png" width="800" height="200" /><img src="graphics/backgrounds/home_02.png" width="800" height="200" /><img src="graphics/backgrounds/home_03.png" width="800" height="200"/>
 
 </div>
 
 <div id="navigation" style="margin:-520px auto 0;">
 
 <iframe name="navi" src="navi/empty.html" frameBorder="0" width="539px" scrolling="no" height="25px" ALLOWTRANSPARENCY="true"></iframe>
 
 </div>
 
 </body>
 </html>

Der Layer "navigation" wird wie gesagt beim FF nicht zentriert...

Gruß

Dennis
 
Es liegt zum einen an der widersprüchlichen Breitenangabe für das umschliessende DIV#navigation, das nur 200px breit sein soll, obwohl das eingebettete iFrame-Element 539px breit ist, und zum anderen an der 'dreiseitigen' Angabe zum Außenabstand, die vom Firefox scheinbar falsch interpretiert wird.

Hier der korrigierte Quelltext:

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>Unbenanntes Dokument</title>
 <link href="styles.css" rel="stylesheet" type="text/css" />
 <style type="text/css">
 img {
 behavior: url("pngbehavior.htc");
 }

 #navigation {
         width:539px;
         height:25px;
         z-index:2;
         margin:-520px auto 0 auto;
 }

 #oben {
         visibility:visible;
         width: 800px;
         height: 600px;
         z-index:1;
         margin:auto;

 }
 </style>

 </head>
 <body topmargin="100" marginheight="100">

 <div id="oben">

 <img src="graphics/backgrounds/home_01.png" width="800" height="200" /><img src="graphics/backgrounds/home_02.png" width="800" height="200" /><img src="graphics/backgrounds/home_03.png" width="800" height="200" />

 </div>

 <div id="navigation">

 <iframe name="navi" id="navi" src="navi/empty.html" frameborder="0" width="539" scrolling="no" height="25" ALLOWTRANSPARENCY="true"></iframe>

 </div>

 </body>
 </html>
Anmerkung: in den HTML-Attributen width,height werden keine Einheiten, wie z.B. px, notiert (!)

Code: 
<iframe name="navi" src="navi/empty.html" frameBorder="0" width="539px" scrolling="no" height="25px" ALLOWTRANSPARENCY="true"></iframe>
 
Hallo,

VIELEN, VIELEN Dank... Das mit dem Frame lag daran das ich den Code von ner anderen, alten Seiten einfach mal rüberkopiert hatte. Hab das gar nicht so genau gesehen. Jetzt funktioniert es bei beiden.

Danke

Dennis
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück