Vlad: [JavaScript] resizable fixed/variable Spaltenlayout

SELF-Forum

[JavaScript] resizable fixed/variable Spaltenlayout

Vlad
– Informationen zu den Bewertungsregeln

Hi ich möchte ein Layout mit einer fixen und einer entsprechend dem freien Platz auffüllenden Spalte machen.

die fixe Spale soll aber resize:horizontal bekommen.

Ich hab jetzt folgenden Code:

  
<html>  
  <head>  
  <style type="text/css">  
    #main{  
      position:absolute;  
      background-color:lightgray;  
      height:80%;  
      width:80%;  
      left:10%;  
      top:10%;  
    }  
    #left{  
      background-color:blue;  
      position:absolute;  
      left:0;  
      top:0;  
      bottom:0;  
      width:200px;  
      max-width:80%;  
      resize:horizontal;  
      overflow:auto;  
    }  
    #right{  
      background-color:darkgreen;  
      position:absolute;  
      left:200px;  
      right:0;  
      top:0;  
      bottom:0;  
      overflow:auto;  
    }  
  </style>  
  
    <title>test</title>  
  </head>  
  <body >  
    <div id="main"  >  
      <div id="left">a</div>  
      <div id="right" >b<div>  
    </div>  
  </body>  
</html>

soweit so gut, das Basislayout funktioniert.
Wenn das fenster fergrößert oder verkleiner wird, bleibt die eine Spalte fix und die andere passt sich an.

wie stelle ich es aber an, dass nach vergrößern/verkleinern des #left-elements sich das right element auch anpasst?

gibt es eine bessere Möglichkeit der css definition für das "restlichen Platz einnehmen"?

ich hab es mit dem
onresize="document.getElementById('right').left = event.target.width;"
im #left element probiert, aber das onresize-Event wird nicht gefeuert.
(Browser: FF11)

Gruß und Dank
Vlad

Beitrag melden
–
Informationen zu den Bewertungsregeln