[table] Scrollen in tabel met overflow in een frame

[Verwijderd]

Ik zit nu al een tijdje met een probleem waar ik al veel naar gezocht heb, maar geen goede oplossing gevonden (die ik begrijp)

ik heb een tabel van 9 vlakken waarin ik in de middelste een scrollbar wil hebben, maar de randen van de tabel moeten net zo groot zijn als het frame.

Ik heb al wel gelezen dat je zoiets met layers moet doen, maar ik begrijp niet waar ik die dan moet toepassen in de tabel of buiten de tabel ofzo.

Ik heb het nu zo dat de scrollbar in het frame zit, niet in de tabel.

Het zit in een functie waarbij ik aan kan geven of ik het bovenste of onderste deel wil zien. Alle images worden uit de database getrokken en daarbij ook de hoogte en breedte. Verder is alle content in het midden van de tabel variabel.

Heeft iemand een oplossing voor mij?

Hier is de php code:

PHP:

function main_table ($number) {
    global $main_tabel, $sys_httpdir, $sys_table_bg_color, $thema_id;
    if ($main_tabel) {

        $sql = "SELECT img_table_image_top_left_x, img_table_image_top_left_y, img_table_image_middle_left_x, img_table_image_middle_left_y, ";
        $sql .= "img_table_image_bottom_left_x, img_table_image_bottom_left_y, img_table_image_top_middle_x, img_table_image_top_middle_y, ";
        $sql .= "img_table_image_bottom_middle_x, img_table_image_bottom_middle_y, img_table_image_top_right_x, img_table_image_top_right_y, ";
        $sql .= "img_table_image_middle_right_x, img_table_image_middle_right_y, img_table_image_bottom_right_x, img_table_image_bottom_right_y ";
        $sql .= "FROM themes WHERE theme_id = '$thema_id'";
        $result = mysql_query($sql) or die (mysql_error());
        $table_images_data = mysql_fetch_array($result) or die (mysql_error());
            
        if ($number == 1) {
        
            echo "<table width=\"100%\" height=\"100%\" cellpadding=\"0\" cellspacing=\"0\">";
            echo "<tr>";
            
            echo "<td width=\"$table_images_data[img_table_image_top_left_x]\" height=\"$table_images_data[img_table_image_top_left_y]\">";
            echo "[img]\"{$sys_httpdir}img.php?".sessionGet()."&img=top_left&table=1\"[/img]";
            echo "</td>";
            
            echo "<td width=\"100%\" height=\"$table_images_data[img_table_image_top_middle_y]\" background=\"{$sys_httpdir}img.php?".sessionGet()."&img=top_middle&table=1\">";
            echo "</td>";
            
            echo "<td width=\"$table_images_data[img_table_image_top_right_x]\" height=\"$table_images_data[img_table_image_top_right_y]\">";
            echo "[img]\"{$sys_httpdir}img.php?".sessionGet()."&img=top_right&table=1\"[/img]";
            echo "</td>";
            echo "</tr>";
            
            echo "<tr>";
            echo "<td width=\"$table_images_data[img_table_image_middle_left_x]\" height=\"100%\" background=\"{$sys_httpdir}img.php?".sessionGet()."&img=middle_left&table=1\">";
            echo "</td>";
            
            echo "<td width=\"100%\" bgcolor=\"$sys_table_bg_color\" style=\"overflow: auto;\">";
            
        } elseif ($number == 2) {
        
            echo "</td>";
            echo "<td width=\"$table_images_data[img_table_image_middle_right_x]\" height=\"100%\" background=\"{$sys_httpdir}img.php?".sessionGet()."&img=middle_right&table=1\">";
            echo "</td>";
            echo "</tr>";
            
            echo "<tr>";
        
            echo "<td width=\"$table_images_data[img_table_image_bottom_left_x]\" height=\"$table_images_data[img_table_image_bottom_left_y]\">";
            echo "[img]\"{$sys_httpdir}img.php?".sessionGet()."&img=bottom_left&table=1\"[/img]";
            echo "</td>";
            
            echo "<td width=\"100%\" height=\"$table_images_data[img_table_image_bottom_middle_y]\" background=\"{$sys_httpdir}img.php?".sessionGet()."&img=bottom_middle&table=1\">";
            echo "</td>";
            
            echo "<td width=\"$table_images_data[img_table_image_bottom_right_x]\" height=\"$table_images_data[img_table_image_bottom_right_y]\">";
            echo "[img]\"{$sys_httpdir}img.php?".sessionGet()."&img=bottom_right&table=1\"[/img]";
            echo "</td>";
            echo "</tr>";
            echo "</table>\n";
        }
    }
}

[ Voor 16% gewijzigd door Verwijderd op 14-10-2004 11:15 ]

[André]

En hoe ziet de output van die php er uit? Heb je een url?

Als je een table net zo groot als het frame wil hebben moet je de margins en padding van de body op 0 zetten. En als je iets wilt laten scrollen kun je het object een overflow: scroll meegeven.

[Verwijderd]

Ik heb al geprobeerd om de tabel een
style = "overflow: scroll; "
te geven en de margins op 0 gezet.

Maar de scrollbar zit nog in het frame.
Ik wil namelijk dat de tabel aan de onderkant gelijk is met de onderkant
van het frame. En de content wel kan scrollen.

Ik begrijp dat dat met layers moet gebeuren.
Ik begrijp alleen niet hoe en waar die dan moeten komen.

[André]

Je kunt dan de td laten scrollen of een layer:

code:

TD { overflow: scroll; }
DIV { overflow: scroll; }

Die layer plaats je in een TD.

[Verwijderd]

Dat heb ik dus geprobeerd.
Het probleem is dat de clipping op de een of andere manier niet werkt.

Als ik het bij TD in de stylesheet zet krijg ik wel hele rare dingen te zien,
maar geen scrollbar binnen de tabel

[André]

Verwijderd schreef op 14 oktober 2004 @ 11:56:
Dat heb ik dus geprobeerd.
Het probleem is dat de clipping op de een of andere manier niet werkt.

Als ik het bij TD in de stylesheet zet krijg ik wel hele rare dingen te zien,
maar geen scrollbar binnen de tabel

Binnen de tabel kan ook niet in IE, binnen een cel wel. In FF kun je geloof ik de TBODY laten scrollen.

[Verwijderd]

André schreef op 14 oktober 2004 @ 12:00:
[...]

Binnen de tabel kan ook niet in IE, binnen een cel wel. In FF kun je geloof ik de TBODY laten scrollen.

Ik bedoel ook binnen een cel in IE. Voor mij maken andere browsers ook niet uit. Het wil alleen niet werken in een cel.

[André]

code:

<table>
  <tr>
    <td>
      <div style="height: 100px; width: 100px; overflow: scroll">
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
        Blablablablabla<br>
      </div>
    </td>
  </tr>
</table>

[Verwijderd]

Bedankt.
Nu werkt het wel.

alleen height: 100%; width:100% erbij
Zo simpel ...

[ Voor 3% gewijzigd door Verwijderd op 14-10-2004 12:20 ]