菜单隐藏在布局div后面

时间:2014-02-11 05:38:37

标签: javascript html css html5 css3

布局北部区域的菜单不可见。它已被隐藏在布局下。问题可能出在CSS部分,我试过但无法解决它。

请参考jsfiddle以获取参考http://jsfiddle.net/4QbqY/

<div class="ui-layout-north">
    <div>
<nav>
    <ul>
        <li>
            <a href="home.html">File <span class="caret"></span></a>
            <div>
                <ul>
                    <li>
                        <a href="aa.html">New</a>
                    </li>
                    <li>
                        <a href="aa.html">Open</a>
                    </li>
                </ul>
            </div>
        </li>

        <li>
                <a href="products.html">Action <span class="caret"></span></a>
                <div>
                    <ul>
                        <li>
                            <a href="products.html#chair">Edit      <span class="caret"></span></a>
                            <div>
                                <ul>
                                    <li><a href="#">Undo</a></li>
                                    <li><a href="#">Redo</a></li>
                                    <li><a href="#">Cut</a></li>
                                    <li><a href="#">Copy</a></li>
                                    <li><a href="#">Paste</a></li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
         </li>
    </ul>
</nav>
</div>
</div>

<div class="ui-layout-west" id="testdata">
</div>

<div class="ui-layout-south">
    This is the south pane
</div>

<div class="ui-layout-east">
    This is the east pane
</div>

<div class="ui-layout-center">
    This is the center pane
</div>

2 个答案:

答案 0 :(得分:1)

几分钟后。 这是你想要的结果。

Fiddle

<强> HTML

只需在您的北部布局onmouseover="myLayout.allowOverflow('north')"

中添加此内容即可
<div class="ui-layout-north" onmouseover="myLayout.allowOverflow('north')">

参考:

http://layout.jquery-dev.net/demos/simple.html

答案 1 :(得分:1)

更新导航&gt; ul&gt; li> div,nav&gt; ul&gt; li> div ul&gt; li> div with:

 z-index:3;

并添加此样式:

.ui-layout-north
{
    position:initial !important;
    z-index:3 !important;
}

jsfiddle Here