小程序重叠
我创建了一个 javafx 小程序,它将在 jquery 弹出窗口中加载。我还有一个弹出窗口,它也将加载到同一页面中。
当我单击小程序弹出窗口,然后单击正常弹出窗口时。我可以看到小程序弹出窗口与弹出窗口重叠。请提出任何解决方案。
<html>
<script>
function openPopup() {
$("#dialogID").dialog();
getAudioPlayer("dialogID");
}
function openPopup1() {
$("#rubricID").dialog();
}
function getAudioPlayer(parentObj) {
alert("HI");
var fxstring = javafxString(
{
archive: "JavaFXApplication1.jar",
width: 250,
height: 80,
code: "javafxapplication1.Main",
name: "myApplet",
id: "myApp"
}
);
document.getElementById(parentObj).innerHTML = fxstring;
}
</script>
<input value="Audio Response" onclick="openPopup()" type="button">
<input value="Pop Up" onclick="openPopup1()" type="button">
<div id="dialogID"
style="display: none; width: 1000px; height: 1000px; overflow:visible; background-color: #AAAAAA; font-family: Arial, Verdana, Sans Serif; font-size: 12px; font-style: normal; font-weight: normal;z-index: -1;">
</div>
<div id="rubricID"
style="display: none; width: 1000px; height: 1000px; overflow:visible; background-color: #FFFFFF; font-family: Arial, Verdana, Sans Serif; font-size: 12px; font-style: normal; font-weight: normal;z-index: 100;">
</div>
</body>
</html>
I have created an javafx applet which will be loaded in a jquery pop up. I have one more pop up which will also be loaded in the same page.
When i click the applet pop up and then click the normal pop up. I can see that the applet pop up is overlapping the pop up. Please suggest any solution.
<html>
<script>
function openPopup() {
$("#dialogID").dialog();
getAudioPlayer("dialogID");
}
function openPopup1() {
$("#rubricID").dialog();
}
function getAudioPlayer(parentObj) {
alert("HI");
var fxstring = javafxString(
{
archive: "JavaFXApplication1.jar",
width: 250,
height: 80,
code: "javafxapplication1.Main",
name: "myApplet",
id: "myApp"
}
);
document.getElementById(parentObj).innerHTML = fxstring;
}
</script>
<input value="Audio Response" onclick="openPopup()" type="button">
<input value="Pop Up" onclick="openPopup1()" type="button">
<div id="dialogID"
style="display: none; width: 1000px; height: 1000px; overflow:visible; background-color: #AAAAAA; font-family: Arial, Verdana, Sans Serif; font-size: 12px; font-style: normal; font-weight: normal;z-index: -1;">
</div>
<div id="rubricID"
style="display: none; width: 1000px; height: 1000px; overflow:visible; background-color: #FFFFFF; font-family: Arial, Verdana, Sans Serif; font-size: 12px; font-style: normal; font-weight: normal;z-index: 100;">
</div>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
检查 css 我认为它与 zindex 有关,
检查一下 http://jsfiddle.net/EqUxz/< /a> 示例:)
check on th css I think it has something to do with the zindex
check this out http://jsfiddle.net/EqUxz/ for a sample :)