✔ iframe höhe automatisch!

Status
Nicht offen für weitere Antworten.
babone

babone

Mitglied
Hallo,
ich habe im Internet einen Javascript gefunden womit sich die Höhe vom iframe automatisch auf die Höhe vom Inhalt.Html anpasst.
Mein Problem ist, dass es bei Friefox gar nicht funktioniert.
Und bei Opera und IE Die untere Leiste vom Index.html zu weit nach unten verschiebt.
Bei IE korrigiert es sich wenn man an der Standardschaltflächen einmal Zurück und dann wieder Vorwärts klickt.

LINK

Kann bei diesem Problem einer helfen!

Vielen Danke!

Babone
 
Zuletzt bearbeitet:
Hallo zusammen.
Ich habe ein ähnliches Problem. Auf meiner Website möchte ich ein Forum (phpbb) mittels iframe einfügen, wobei oberhalb der gewohnte Banner der Site stehen sollte und unter dem Forum ein (c) sowie Kontaktmöglichkeit. Zwischen diesen beiden Elementen sollte das iframe so gross wie möglich angezeigt werden, nach Möglichkeit dynamisch je nach grösse des Fensters.
Doch, wie kann ich dies bloss so einrichten?
Viiielen Dank für Eure Hilfe, ich weiss nicht mehr weiter :confused:

Link zur Website mit fraglichem iframe: http://www.boersentalk.com/forum
 
Hi,

hier ein grundlegendes Beispiel für einen iFrame mit relativer Höhe, die sich der Browserfenstergröße anpasst:

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="author" content="Maik">
<title>tutorials.de | demo_brawnyhunk</title>

<style type="text/css">
<!--
html, body {
height:100%;
margin:0;
padding:0;
}

#wrapper {
height:100%;
width:720px;
margin:0 auto;
}

#wrapper #forum {
height:95%;
}

#wrapper #forum iframe {
width:100%;
height:99%;
}
-->
</style>

</head>
<body>

<div id="wrapper">
     <div id="banner">banner</div>
     <div id="forum">
          <iframe src="http://www.boersentalk.com/forum/phpbb/">
                  <p>Ihr Browser kann leider keine eingebetteten Frames anzeigen: Sie k&ouml;nnen die eingebettete Seite über den folgenden Verweis aufrufen: <a href="http://www.boersentalk.com/forum/phpbb/">Forum</a></p>
          </iframe>
     </div>
     <div id="footer">footer</div>
</div>

</body>
</html>
 
wow, vielen dank :) und es funktioniert ;-)

falls ich nun möchte, dass das iframe automatisch immer bis ganz zum Ende der Site (unten) reicht, was müsste ich verändern? Im Moment wir das Forum so angezeigt http://www.boersentalk.com/forum/ -- unten bräuchte es eigenlich kein Blau mehr zu haben.

Danke nochmals.
 
In diesem Fall dürfte dir http://www.cssplay.co.uk/layouts/basics.html weiterhelfen.

In dem Beispiel wird das DIV #content im Anzeigefenster fest positioniert und nimmt den iFrame auf:

Code: 
<!-- Put IE into quirks mode -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title> stu nicholls | CSS PLaY | cross browser fixed layout bare essentials </title>
<style type="text/css" media="screen">
* {
margin:0;
padding:0;
}

html {
height:100%;
max-height:100%;
border:0;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow: hidden;
/* */
}

body {
height:100%;
max-height:100%;
overflow:hidden;
border:0;
background:#000033;
}

#wrapper {
position:relative;
height:100%;
width:740px;
left:50%;
margin-left:-370px;
}

#banner {
position:absolute;
z-index:4;
top:0px;
left:0px;
width:100%;
height:130px;
background:#000033;
text-align:center;
}

#content {
overflow:hidden;
position:absolute;
z-index:3;
top:130px;
bottom:0px;
left:0px;
right:0;
}

* html #content {
height:100%;
width:100%;
top:0;
left:0;
border-top:130px solid #000;
}

#content iframe {
width:100%;
height:100%;
}
</style>

</head>
<body>

<div id="wrapper">
     <div id="banner">
          <a href="http://www.boersentalk.com/"><img src="http://www.boersentalk.com/img/banner.jpg" alt="http://www.boersentalk.com" width="648" height="95" border="0"></a>
     </div>
     <div id="content">
          <iframe src="http://www.boersentalk.com/forum/phpbb/">
                  <p>Ihr Browser kann leider keine eingebetteten Frames anzeigen: Sie können die eingebettete Seite über den folgenden Verweis aufrufen: <a href="http://www.boersentalk.com/forum/phpbb/">Forum</a></p>
          </iframe>
     </div>
</div>

</body>
</html>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück