下拉只能在Chrome中起作用-英雄云拓展知识分享

匿名投稿 346 2024-01-22

我不能不在一个下拉菜单中侵入电子商务网站中的元素，在该网站上，由于HTML结构，CSS没法完成表演/隐藏。

我想出了这个代码，但它仅在Chrome中起作用。在IE＆amp;当光标离开蓝色并超出红色时，下拉菜单立即消失。为何这是我应当如何解决的？

$("#button").hover(function() {
$("#mainmenu").show();
},
function() {
if (!$("#mainmenu").is(":hover")) {
$("#mainmenu").hide();
}
}
);
$("#mainmenu").hover(
function() {
},
function() {
$("#mainmenu").hide();
});

#button{width: 300px;
height: 30px;
background-color: blue;
}
#mainmenu{
width: 300px;
height: 600px;
background-color: red;
position: absolute;
display: none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div id="button"></div><div id="mainmenu"></div>

看答案

添加 $("#mainmenu").show(); 在第一个回调功能的内部 $("#mainmenu").hover():

$("#button").hover(function() {
$("#mainmenu").show();
},
function() {
if (!$("#mainmenu").is(":hover")) {
$("#mainmenu").hide();
}
}
);
$("#mainmenu").hover(
function() {
$("#mainmenu").show();
},
function() {
$("#mainmenu").hide();
});

#button {width: 300px;
height: 30px;
background-color: blue;
}
#mainmenu {
width: 300px;
height: 600px;
background-color: red;
position: absolute;
display: none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div id="button"></div><div id="mainmenu"></div>

🚀🌟 点击注册免费试用超级应用平台-英雄云企业级hpapaas 🌟🚀 😃👉🌐

免责声明：

本网址（www.yingxiongyun.com）发布的材料主要源于独立创作和网友匿名投稿。此处提供的所有信息仅供参考之用。我们致力于提供准确且可信的信息，但不对材料的完整性或真实性作出任何保证。用户应自行验证相关信息的正确性，并对其决策承担全部责任。对于由于信息的错误、不准确或遗漏所造成的任何损失，本网址不承担任何法律责任。本网站所展示的所有内容，如文字、图像、标志、音频、视频、软件和程序等的版权均属于原创作者。如果任何组织或个人认为网站内容可能侵犯其知识产权，或包含不准确之处，请即刻联系我们进行相应处理。