Javascript Fancybox位于导航菜单后面
我有下面的div结构Javascript Fancybox位于导航菜单后面,javascript,jquery,jquery-plugins,fancybox,Javascript,Jquery,Jquery Plugins,Fancybox,我有下面的div结构 <div class="page"> <div id="top" class="header-container"> <!-- navigation menu and search box in here --> </div> <div class="main-container col1-layout"> <!-- Fancybox for
<div class="page">
<div id="top" class="header-container">
<!-- navigation menu and search box in here -->
</div>
<div class="main-container col1-layout">
<!-- Fancybox for photo gallery and onther content in here -->
</div>
</div>
当我的页面一直滚动到顶部(页面的正常加载位置)时,我的Fancybox位于导航菜单后面,但是当我向下滚动页面时,这个问题就解决了
如何将Fancybox覆盖在导航菜单的顶部?我正在使用jquery.fancybox-1.3.4.js
谢谢尝试在菜单和fancybox div的一个类中设置css属性
z-index
:
.header-container {
z-index: 1;
}
.main-container {
z-index: 2;
}
应该位于其他元素之上的元素必须具有更大的z索引
fancybox元素的z索引。这可能会有帮助像其他答案一样,表明z-index是您需要实现的
但要使用z指数,您需要应用位置:相对;(或位置:绝对;)让它工作。谢谢大家。z-索引+相对位置解决了我的问题 您可以使用z-index绝对定位来覆盖更改fancybox z-index大于菜单z-index或菜单小于fancybox z-index Xz-index是唯一的解决方案…感谢各位的建议。对于整个主容器div或只是fancybox?Rob,通过这样做,滚动时导航栏将位于内容或图像的后面