0

私は約 1 週間前に同様の質問をしましたが、今は別の問題を抱えています。
以前は、動的な jQuery タブを Web サイトのナビゲーション バーの前に表示しようとしていました。動的タブには、「ユーザー コントロール パネル」や「クイック リンク」などのユーザー オブジェクトが含まれます。

とにかく、CSS で利用可能な「z」座標を使用して、ナビゲーション メニュー (および Web サイトの残りの部分) の前にタブ (最小化前および最小化後) を配置することができました。しかし、私は今別の問題を抱えています。タブは、次のように Web ページの横に並んでいます。

                                                                             T
                                                                             A
                                                                             B
                                                                             1

                                                                             T
                                                                             A
                                                                             B
                                                                             2

                                                                             T
                                                                             A
                                                                             B
                                                                             3

                                                                             T
                                                                             A
                                                                             B
                                                                             4

タブの1つをクリックすると、データの入ったボックスがサイドパネルから出てきて(そうあるべきです)、側面に沿ってスペースを取り、他のタブを押し下げます。とにかくタブが所定の位置にとどまり、ボックスが出てくるようにしたいと思います。これが今の動作です:

                                                                             T
                                                                             A                                                                                                     
                                                                             B
                                                                             1
_____________________________________________________________________________
|
|
|
|
|
|
|
|
|
|
|
|
|
|
----------------------------------------------------------------------------
                                                                             T
                                                                             A
                                                                             B
                                                                             2

                                                                             T
                                                                             A
                                                                             B
                                                                             3

                                                                             T
                                                                             A
                                                                             B
                                                                             4

コード: http://jsfiddle.net/hLLPL/

4

1 に答える 1

1

コメントで提案したように、更新されたfiddleの実際の例を次に示します。

私がしたこと

  1. すべての静的クラスdivを親の中に入れますdiv。(追記: 自分のコーディング パラダイムに合うようにクラスを変更しました。

    <div class="static">
      <div style="background:url('assets/img/tab_ucp.png');" id="static1" class="stat"></div>
      <div style="background:url('assets/img/tab_aqa.png');" id="static2" class="stat"></div>
      <div style="background:url('assets/img/tab_cr.png');" id="static3" class="stat"></div>
      <div style="background:url('assets/img/tab_ql.png');" id="static4" class="stat"></div>
    </div>
    
  2. この CSS を親に割り当てdivます。

    .static {
      position: absolute;
      top: 0px;
      right: 0px;
    }
    
于 2013-01-15T22:26:50.583 に答える