2011-07-27 10 views
1

が、私のタブの2のコンテンツは現在、CSSを使用してjQueryのタブ、CSSおよび分割ライン

<div id='leftnav'>left hand menu</div> 
<div id='mainbody'>Main content here</div> 

のように分割され、私は1つが停止し、他の開始位置を示すために、単一のラインバーを持っています。

#leftnav 
{ 
    float: left; 
    width: auto; 
    border-right: 1px solid gray; 
    margin: 0; 
    padding: 0.5em; 
} 

本体の内容は、leftnavから選択したオプションによって変わります。これはページの高さを変えますが、それらを分離する行の高さは同じにとどまります。このダイナミックなやり方で、どのようにしてメインボディの高さをつくることができるのでしょうか?

答えて

0

おそらくuは、height:100%;をcssに追加できます。あなたはそれを試しましたか?

2

このダイナミックなやり方はありますか?本体の高さは常に ですか?

タブが選択されている場合、あなたはこのような何かを実行できます:あなたは#mainbodyの高さに#leftnavの高さを設定する必要がある、または同じ境界線を#mainbody与えるだろう

$('#leftnav').height($('#mainbody').height()); 
+0

ありがとう、どうすれば 'onChange'を行うことができますか? – martok

+0

あなたは['tabsshow'イベント](http://jqueryui.com/demos/tabs/#event-show)を使いたいと思います。したがって:$( ".selector").tabs({ show:function(event、ui){ $( '#leftnav')の高さ($( '#本体)の高さ());} }); ' – thirtydot

+0

ありがとう、私は今日これを試して、報告します。 – martok

0

を代わりに境界線として左に

関連する問題