table scrollen, iframe, object - Höhe anpassen

Status
Nicht offen für weitere Antworten.
V

veru

Grünschnabel
Hallo,

ich habe eine Tabelle, 3x3 Zellen gross. Die erste und dritte Zeile sowie die erste und dritte Spalte sind auf fixe Breiten bzw. Höhen gestellt, einzig die mittlere ist in beide Richtungen variabel.

In dieser Zelle soll nun der eigentliche Inhalt stehen und zwar so, dass immer der gesamte zur Verfügung stehende Platz ausgenutzt wird und, sollte dieser nicht ausreichen, gescrollt werden kann.

Ich habs mit iframe und object probiert, den Inhalt in die Zelle zu laden. Dabei wird der Inhalt zwar an die aktuelle Breite angepasst, die Höhe aber nicht.:

<object data="inhalt.html" type="text/html" style="width:100%; height:100%;"></object>

bzw.

<iframe src="inhalt.html" frameborder="0" height="100%" width="100%"</iframe>

wobei ich es in beiden Fällen sowohl mit setzten der HTML- als auch der CSS Eigenschaft height probiert habe.

Der dritte Versuch war mit einem scrollbaren Bereich mit overflow:scroll zu definieren, aber da muss man anscheinend immer absolute Breiten wie Höhen angeben, oder?

Was in manchen Browsern klappt, aber nicht HTML4.0-konform ist, ist onResize zu verwenden, eine Funktion zu schreiben, die die mögliche Größe des iframes berechnet und diese mit resizeTo() zu setzen. Das hat halbwegs funktioniert, ist aber nicht die Art, wie ich es gerne lösen würde. Welche Möglichkeiten gibts sonst noch, bzw. was habe ich bei diesen hier falsch gemacht?

thx,
Verena
 
Original geschrieben von veru
...
<iframe src="inhalt.html" frameborder="0" height="100%" width="100%"</iframe>
...
Zum Vergrößern anklicken....
Nur mal als kleine Info, falls Du den Code genau aus Deiner Seite hast, da fehlt ein > vor </iframe>
Weiss aber nicht ob es daran liegt...

MFG Eminem
 
Das > ist im Orginal schon da. Ich hatte nur mit einigen Optionen gespielt, bevor ich den Code hierher kopiert habe. Dabei habe ich es wohl gelöscht.

Grüße,
Verena
 
Hi!

Also ich habe nach 1,5 stündiger Recherche und vor allem Herumprobiererei eine für mich befriedigende Lösung gefunden.

Dabei habe ich keine iFrames verwendet sondern DIV Elemente.

Dazu habe ich in der vorhandenen Tabelle ein DIV-Element mit entsprechender Größe eingefügt:

PHP: 
.
.
.
<td style="background-color: #FFFCF4;
	             background-image: url(pic/index2_03.jpg);
               vertical-align: text-top;"
               width="466" height="468">
      <div style="width:100%; height:100%; align:center; valign:top; background-color:transparent; overflow: auto;">
      
      <?php
        if ($page == "news") {
          mysql_server_connect();
            $query = mysql_query("SELECT titel, datum, inhalt FROM news ORDER BY datum DESC");
              while ($row = mysql_fetch_array($query)) {
                echo "<table width=90% align=center border=0 style=background-color:transparent>
                        <tr> 
                          <td width=75% cellpadding=0 cellspacing=0 class=newstitel>$row[titel]</td>
                          <td width=25% cellpadding=0 cellspacing=0 class=newsdatum>$row[datum]</td>
                        </tr>
                        <tr>
                          <td height=110 cellpadding=0 cellspacing=0 colspan=2 class=newstext>$row[inhalt]</td>
                        </tr>
                      </table>";
              }
          mysql_close();
        }
?>
  </div>
</td>

Hierbei ist das php-Script lediglich dazu gedacht, in den DIV-Tag eine Tabelle mit bestimmten Informationen reinzupacken.
Dies kann aber auch durch einfache <table><tr><td> usw. Anweisungen manuell geschehen, muss also kein PHP für verwendet werden.
In diesem Fall werden News von einer Datenbank abgerufen und wenn die abgerufenen Informationen in ihrer Auflistung die Grenzgröße des DIV-Tags erreichen, erscheint die Scrollbar auf der rechten Seite!

Als ich alles soweit hatte, fiel mir auf, dass es partout nicht funktionieren wollte. Ich habe dann im Quellcode verschiedenste Schreibweisen ausprobiert, aber nichts hat geholfen...

Schließlich und endlich fand ich im Netz eine nicht ganz aufschlussreiche Beispielseite, die mir jedoch den entscheidenen Hinweis lieferte.
Im <body>-Tag muss noch die Anweisung scroll = "auto" platziert werden. Das sieht dann folgendermaßen aus:

PHP: 
.
.
.
<title>Nachbarschaft Berkeltal • Gescher</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="buttons.css">
<link rel="stylesheet" type="text/css" href="news-style.css">
<link rel="stylesheet" type="text/css" href="standard-text.css">
</head>
<body background="pic/Background-Image.jpg"
      scroll="auto"
.
.
.

So - ich denke, dass Du jetzt einen Überblick haben solltest, wie es funktionieren kann. Die Seite, für die ich das kreiert habe ist
http://www.nachbarschaft-berkeltal.de

Viel Glück dabei!
 
Hi,

danke für Deine Antwort, genau so etwas habe ich gesucht! Das einzige Problem ist nur, dass bei mir immer beide Scrollbalken angezeigt werden,egal ob nötig oder nicht. habe es mit overflow:scroll und overflow:auto versucht. Gibts weitere Möglichkeiten, die Anzeige der Scrollbars zu beeinflussen?

Nochmals vielen Dank,
Verena
 
Versuchs mal damit.

Schreib in den Body der index datei, bzw. in die Datei in der die Angabe für den iframe ist, scroll=no
 
bloß net

Das führt dazu, dass Du gar net mehr scrollen kannst auf der Site. Das wäre wohl kaum im Sinne des Erfinders.

Ich glaube, dass es eine Möglichkeit mit Javascript gibt, vertikale und/oder horzontale Scrollbalken zu verstecken.....

Allerdings bin ich mir dessen überhaupt net sicher, weil ich mich mit Javascript nicht genügend auskenne.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück