尝试使iframe垫片在Java小程序上使用CSS下拉菜单
因此,我有一个页面,它运行通过外部源生成的java小程序。我还从我自己的另一个站点获得了一些源代码,它使用CSS创建下拉菜单。我正在尝试在新的java小程序页面中实现相同的下拉样式 问题是,我的菜单总是在java小程序下面分层,而不考虑z层。我认为这是一个“已回答”的问题:。然而,“解决方案”是一个死链接 我尝试在这里修改代码:以适合我的应用程序 我的实现在多个层次上都失败了。首先,每当显示“我的垫片/下拉列表”时,它会将整个页面的内容向下移动20 ish px。其次,该插件下的下拉菜单仍然消失 以下是代码的相关部分: CSS: HTML:尝试使iframe垫片在Java小程序上使用CSS下拉菜单,java,html,css,iframe,applet,Java,Html,Css,Iframe,Applet,因此,我有一个页面,它运行通过外部源生成的java小程序。我还从我自己的另一个站点获得了一些源代码,它使用CSS创建下拉菜单。我正在尝试在新的java小程序页面中实现相同的下拉样式 问题是,我的菜单总是在java小程序下面分层,而不考虑z层。我认为这是一个“已回答”的问题:。然而,“解决方案”是一个死链接 我尝试在这里修改代码:以适合我的应用程序 我的实现在多个层次上都失败了。首先,每当显示“我的垫片/下拉列表”时,它会将整个页面的内容向下移动20 ish px。其次,该插件下的下拉菜单仍然消失
.iframeshim-container {
position:relative;
z-index: 100;
}
header ul.menu li.parent ul {
background:url(dropdown_bg.png) 50% 0 repeat-x #98A2A9;
display:none;
left:0;
margin:0;
padding:10px;
position:absolute;
top:1px;
width:200px;
z-index:100;
}
.iframeshim-container .content-container{
display:none;
margin: 0;
padding: 0;
overflow: hidden;
width: 100%;
height: 100%;
}
.iframeshim-container .shim-iframe{
display:none;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: -10000;
}
header ul.menu li.parent:hover ul {
display: block;
}
header ul.menu li.parent:hover .iframeshim-container .shim-iframe {
display: block;
}
header ul.menu li.parent:hover .iframeshim-container .content-container {
display: block;
}
<div class="container maincontainer">
<header class="clearfix">
<nav>
<ul class="menu" id="mainnav">
<li><a href=".">Home</a></li>
<li class="deeper parent"><a href="#">Test</a>
<div class="iframeshim-container">
<div class="content-container">
<ul>
<li><a href=".">Item 1</a></li>
<li><a href="/">Item 2</a></li>
<li><a href="/">Item 3</a></li>
<li><a href="/">Item 4</a></li>
</ul>
</div>
<iframe class="shim-iframe" frameborder="0" scrolling="no"></iframe>
</div>
</li>
</ul>
</nav>
</header>
<section id="main" class="clearfix">
<div id="content" class="clearfix" style="width: 910px;">
<section id="maincontent">
<APPLET CODE="myCode"></APPLET>
</section>
</div>
</section>
</div>