Question

我有一个带有jQuery菜单的网页，如this和jQuery手风琴。我的问题是手风琴覆盖了菜单（如this），我希望菜单覆盖手风琴。

手风琴的代码是

            <div id="accordionDatos" class="fondo ui-accordion ui-widget ui-helper-reset" role="tablist">

                <h3 class="fondo ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" role="tab" id="ui-accordion-accordion-header-0" aria-controls="ui-accordion-accordion-panel-0" aria-selected="false" aria-expanded="false" tabindex="-1"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-e"></span>Datos personales</h3>
                <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="display: none;" id="ui-accordion-accordion-panel-0" aria-labelledby="ui-accordion-accordion-header-0" role="tabpanel" aria-hidden="true">
                               .......
                </div>      

            </div>

“fondo”类是.fondo {z-index：100;}。我把这个类放在div元素和h3元素中（手风琴标签的标题）。

Answer 1

请检查css。有可能过度编写z-index并使用position：relative相同。

如果你想要一个元素在另一个元素之上。元素的Z-index需要按顺序排列。

ex：top element z-index：2，bottom element z-index应小于2.

  #accordion {z-index:999; position:relatevie }

希望这会对你有所帮助。

Answer 2

试试这个：#accordion {z-index:100;}

Answer 3

尝试设置CSS z-index属性：http://www.w3schools.com/cssref/pr_pos_z-index.asp

在网页中叠加元素

3 个答案: