• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabellezelle verkleiner sich

musclebreast

Mitglied
Hallo,


ich habe folgendes Problem..ich habe eine Tabelle mit 2 spalten..auf der linken seite wird inhalt geladen und auf der rechten seite ein Iframe...funktionierts alles super...die linkte seite ist je nach inhalt unterschiedlich lang...das Iframe hollt sich also die Zellenhöhe und das ist dann auch die höhe des iframes. Funktioniert soweit super...Wenn ich jetzt aber die grösse des browsers mal veränder nach dem laden dann ist die höhe des Iframe nicht mehr 100% der Zellenhöhe. Ich habe den text rationalsiert damit er übersichtlicher ist..nicht wundern über die komische sprache zwischen html. Wie eereiche ist jetzt..dass da Iframe immer die höhe der Zelle hat?

lg

Lara


Code:
<TR>
  <TD VALIGN="top" width="70%">
   
   <!-- Top section: owner, description -->
   
   <SPAN CLASS="aLabel">`[WEBDOC_HTMLLABEL.Owner_]`</SPAN>
      
       
    
    <TABLE>
     <TR><TD> hier lade ich inhalt
           </TD>
      </TR>
        </TABLE>
    
  </TD>
  <TD VALIGN="top"><iframe style="margin-left:40px" name="iframe_a" src="`.ServiceString( .fArgs ) + "://" +  .fArgs.HTTP_HOST``.Url()`?func=ll&objId=289403&objAction=RunReport&&ParmDataID=`node.pID`&nexturl="  WIDTH="100%" HEIGHT="100%"></iframe>
  </TD>
 
 </TR>
 
Könntest du ein komplettes Beispiel posten, das das Problem zeigt und das ohne Strings auskommt, die mit der Frage absolut nichts zu tun haben?
 
ok,

das ist der ganze Teil:

Code:
TR>
  <TD VALIGN="top" width="70%">
   
      
   <SPAN CLASS="aLabel"></SPAN>
      
       
    
    <TABLE>
     <TR><TD> hier lade ich inhalt
           </TD>
      </TR>
        </TABLE>
    
  </TD>
  <TD VALIGN="top"><iframe style="margin-left:40px" name="iframe_a" src=""  WIDTH="100%" HEIGHT="100%"></iframe>
  </TD>

</TR>

ich hoffe es ist jetzt besser zu erkennen. Es geht um die Höhe des Iframes die nach der Grössenveränderung nicht richtig ist.
 
Ich glaube, das geht nur mit JavaScript, da die Höhe der Tabellenzeile nicht definiert ist und height: 100%; deshalb keinen Bezugspunkt hat.



Vollständiges Beispiel:

HTML:
<!DOCTYPE html>

<html lang="en">

    <head>

        <meta charset="UTF-8" />
        <title>Demo</title>
        <style>
            /*<![CDATA[*/
            table {
                border-collapse: collapse;
                border-spacing: 0;
            }

            tr {
                background: red;
            }

            td {
                vertical-align: top;
                padding: 0;

            }

            td.desc {
                width: 70%;
                background: blue;
            }

            td.page {
                width: 30%;
                background: green;
            }

            td.page iframe {
                width: 100%;
                height: 300px;
                border: none;
                display: block;
            }
            /*]]>*/
        </style>

    </head>

    <body>

        <table>
            <tr>
                <td class="desc">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sollicitudin justo at dolor suscipit bibendum. Quisque viverra sagittis tempus. Donec nisl neque, luctus at viverra in, tincidunt vitae ante. Praesent nec ligula pulvinar tortor imperdiet imperdiet. Fusce vitae pulvinar lectus. Sed volutpat fringilla condimentum. Vivamus non est id est ornare hendrerit. Cras sed libero id erat tempor sollicitudin. In dignissim lectus vitae enim scelerisque varius. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sollicitudin justo at dolor suscipit bibendum. Quisque viverra sagittis tempus. Donec nisl neque, luctus at viverra in, tincidunt vitae ante. Praesent nec ligula pulvinar tortor imperdiet imperdiet. Fusce vitae pulvinar lectus. Sed volutpat fringilla condimentum. Vivamus non est id est ornare hendrerit. Cras sed libero id erat tempor sollicitudin. In dignissim lectus vitae enim scelerisque varius.
                </td>
                <td class="page">
                    <iframe src="http://de.wikipedia.org/"></iframe>
                </td>
            </tr>
        </table>

    </body>

</html>
 
Hallo danke,

das ist wirklich eine Möglichkeit. Der Aufruf ist ja einfach und so

var intElemScrollHeight = document.getElementById('name').scrollHeight;
alert(intElemScrollHeight);

jetzt hae ich schon div, tr, td elemente die ID = "name" gegeben und ich bekomme jedesmal den Wert 0 zurück obwohl die Elemente andes definiert sind. Es scheint ein genereller Denkfehler bei mir zu sein..woran kann dies liegen?

lg

lara
 
Ansatz:

Code:
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

        <script>
            /*<![CDATA[*/
            $(function () {
                $(window).bind('resize', function () {
                    $('iframe').height($('td.page').height());
                });
            });
            /*]]>*/
        </script>
 
Das

jetzt hae ich schon div, tr, td elemente die ID = "name" gegeben und ich bekomme jedesmal den Wert 0 zurück obwohl die Elemente andes definiert sind. Es scheint ein genereller Denkfehler bei mir zu sein..woran kann dies liegen?

klingt fast so als hättest Du vielen Elementen gleichzeitig eine ID gegeben? Das geht natürlich nicht. Solltest Du es anders geschrieben haben, poste bitte den Code.
 
hallo,

entschuldigt, dass ich noch mal nerve:= aber hat denn wirklich keiner eine Idee warum ich egal bei welchem Element immer den Wert 0 zurückbekommen, obwohl diese Elemente eine Höhe haben?

LG

Lara
 
Keine Ahnung.

HTML:
<!DOCTYPE html>

<html lang="en">

    <head>
        <meta charset="UTF-8" />
        <title>title</title>

    </head>

    <body>
        <div id="name">#name</div>

        <script>
            /*<![CDATA[*/
            var intElemScrollHeight = document.getElementById('name').scrollHeight;
            alert(intElemScrollHeight);
            /*]]>*/
        </script>

    </body>

</html>
 
Zurück
Oben