DFI10X: Anpassen von Tabelle 1 an Tabelle 2

Hallo,

Ich stehe vor folgendem Problem.
Auf einer HTML Seite gibt 2 Tabellen.
Die untere Tabelle soll sich der Größe der oberen anpassen.
Werden dabei die Felder der unteren zu klein für den enthaltenen Text,
soll der Text abgeschnitten werden und am ende "..." angefügt werden
(ähnlich wie zb in Outlook wenn man bei den empfangene Emails die Breite der Spalten verkleinert..).

Das Anpassen der Größe hab ich mittlerweile hin bekommen.
In den TDs ist jeweils ein DIV dessen größe sich entsprechen anpasst
und somit auch das aussehen der Tabellen verändert.

Ich kann aber bisher nicht über JS erkennen ob Text abgeschnitten wird oder nicht...

Hier der Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Div And Table </TITLE>
</HEAD>
<style>
 DIV { overflow:hidden; border: 1px solid black}
</style>
<BODY>
<TABLE  border=1 cellspacing=0 cellpadding=0>
<TR>
 <TD><div id="1" nowrap>Ein Text</div></TD>
 <TD><div id="2" nowrap>TestTest</div></TD>
</TR>
</TABLE>
<TABLE border=1 cellspacing=0 cellpadding=0>
<TR>
 <TD><div id="1|1" nowrap>Längerer Text</div></TD>
 <TD><div id="1|2" nowrap>TestTestTest</div></TD>
</TR>
</TABLE>

</BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
 var d = document;
 changeTdsAndDivs

function changeTdsAndDivs ()
 {

d.getElementById("1|1").style.pixelWidth = d.getElementById("1").offsetWidth;
  d.getElementById("1|2").style.pixelWidth = d.getElementById("2").offsetWidth;
 }

window.setTimeout("changeTdsAndDivs()",3000);
//-->
</SCRIPT>

</HTML>

Anmerkung:
Ich bin nicht daran interessiert aus den 2 Tabellen eine zu machen.
Die Tabellen werden später in 2 getrennten Frames sein.

  1. hi,

    Ich kann aber bisher nicht über JS erkennen ob Text abgeschnitten wird oder nicht...

    Das wird sich über JS m.E. auch nur schwerlich sauber hinbekommen lassen.

    Die einzige Möglichkeit, die mir einfällt wäre, den Text zu "klonen" und in einem anderen Element, dass unsichtbar oder außerhalb des sichtbaren Bereiches platziert ist, nachzuschauen, ob da die sich automatisch ergebende Höhe größer als x ist.
    Wenn ja, wird der Text in einem Element, welches die feste Höhe x hat (und overflow:hidden), wohl nur "abgeschnitten" dargestellt werden können.
    Jetzt weißt du aber immer noch nicht, _wo_ der Text abgeschnitten wird. Also hieße es jetzt, dieses "Meßverfahren" mit kürzerem Textausschnitt zu wiederholen, bis du irgendwann die "Grenze" zwischen "passt" und "passt nicht mehr" findest.

    Wie man sieht, ist wäre das ein reichlich umständliches und instabiles Herumgebastel - ich rate davon ab.

    Ich bin nicht daran interessiert aus den 2 Tabellen eine zu machen.
    Die Tabellen werden später in 2 getrennten Frames sein.

    Enthalten deine Tabellen überhaupt tabellarische Daten?
    Und "müssen" Frames sein?

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. Enthalten deine Tabellen überhaupt tabellarische Daten?
      Und "müssen" Frames sein?

      Im oberen Frame sind die Feldnamen,
      im unterem Frame die Feldwerte.

      Kommt alles aus einer Datenbank...

      Das Design ist da und ich darf mich damit zurecht finden ;)

      Mittlerweile wurde eine Lösung in einem andern Forum gefunden.
      Ich muß einfach "scrollWidth" mit "offsetWidth" vergleichen.
      Ist das 1. größer so würde der Text abgeschnitten.

      Link zum Beitrag und Code: http://forum.jswelt.de/showthread.php?t=26648

  2. Hi,

    <TD><div id="1" nowrap>Ein Text</div></TD>
    <TD><div id="2" nowrap>TestTest</div></TD>
    <TD><div id="1|1" nowrap>Längerer Text</div></TD>
    <TD><div id="1|2" nowrap>TestTestTest</div></TD>

    Alle 4 id-Attribute haben unzulässige Werte.

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    Schreinerei Waechter
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Alle 4 id-Attribute haben unzulässige Werte.

      Dabke für den Hinweise, aber JS hatte mit diesen IDs keine Probleme...

      1. Hallo DFI10X.

        Alle 4 id-Attribute haben unzulässige Werte.

        Dabke für den Hinweise, aber JS hatte mit diesen IDs keine Probleme...

        JS schert sich ja auch nicht um HTML.

        Einen schönen Mittwoch noch.

        Gruß, Ash*feel free*ura

        --
        Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:) fl:( ss:) ls:[ js:|
        30 Days to becoming an Opera8 Lover -- Shortcuts for Keyboard and Mouse
        Meine Browser: Opera 8.50 | Firefox 1.0.7 | Lynx 2.8.5 | Netscape 4.7 | IE 6.0
        Use OpenOffice.org