Layout con colonne ridimensionabili

[fcolle]

Ciao a tutti,
sono uno sviluppatore asp.net e non sono un granchè pratico del mondo client-side. Ho un problema, vorrei ottenere un layout come quello di msdn, nel quale ci sono due colonne ed è possibile ridimensionare la larghezza trascinando la barra verticale che le divide.
Esiste un modo semplice per farlo (o meglio, qualche layout pronto)?

Grazie e ciao a tutti

[Mich_]

Ho provato a vedere il sito www.msdn.com. Non ho visto la possibilita` di modificare la larghezza delle colonne.
Pero` io uso FF, ed e` possibile che la cosa sia fattibile solo con IE.

Una volta si poteva fare con i frame, ma ora sono deprecati, per cui vengono usati sempre meno.

Comunque nonmi risulta che i CSS nella versione attuale (la 2) abbiano tale possibilita`: potrebbe essere possibile con i CSS3.

[fcolle]

non sono stato corretto. Attualmente msdn usa i frame per ottenere il risultato, ma sono capitato anche su pagine che ottengono lo stesso risultato con script lato client... vorrei capire se è facile oppure no implementare una funzione crossbrowser che mi permetta di avere quell'effetto.

[Mich_]

Ma tu che browser usi?
Perche` ho la netta sensazione, che da MSDN vengano fornite pagine diverse a seconda del browser. Avendo un buon sistema lato sever, la cosa e` fattibile, e anche semplice.

Per cui vediamo cose diverse, anche se all'aspetto sembrano molto simili.

[fcolle]

devo fornire un codice compatibile con IE,FFox e Opera.
Pensavo di inserire una semplice tabella ed il javascript per ridimensionare i td con drag&drop del mouse...

[Mich_]

Se vuoi fare una cosa obsoleta, usa i frame: e` sicuramente meno peggio della tabella.

Se invece vuoi fare una cosa moderna, usa i CSS.

Se hai due blocchi <div>, che in partenza hanno

#container {
  width: 100%;
}
#fascia {
  width: 30%;
  float: left;
  border-right: 2px solid black;
}
#princ {
  width: 69%;
  float: right;
}

(il codice HTML sara`:
<div id="container">
<div id="fascia"> ... </div>
<div id="princ"> ... </div>
</div>

Puoi modificare la posizione della divisione con:
document.getElementById('fascia').style.width="20% "; document.getElementById('princ').style.width="79%" ;

Non so dirti come fare con il drag-and-drop, ma potresti usare delle piccole icone con frecce, e cliccare su quelle.

[fcolle]

Ci proverò grazie