极客观点
项目管理
HarmonyOS
自己做了一个下拉列表,在火狐里面但是一旦鼠标挪到"contain_ul_1"这些标签上就会闪烁,但是在IE里就没有问题,这是怎么回事?
<html>
<head>
<meta content="text/html" charset="utf-8" />
</head>
<title>无标题文档</title>
<style type="text/css">
.head1 {
float: left;
height: 75px;
width: 125px;
}
#head {
list-style-type: none;
}
.contain_ul{
list-style-type:none ;
display:none ;
left:auto ;
right:0 ;
padding:1px;
background-color:#0FF;
}
</style>
</head>
<script>
function change(field , judge)
{
var fields = document.getElementById(field) ;
if(judge)
{
fields.style.display = "block"
}
else
{
fields.style.display = "none"
}
}
</script>
<body>
<ul id="head">
<li class="head1" onmousemove="change('c_u1' , 1 )" onmouseout="change('c_u1' , 0) ">
<a>first</a>
<ul class="contain_ul" id="c_u1">
<li style="background-color:#CF6">contain_ul_1</li>
<li>contain_ul_2</li>
<li>contain_ul_3</li>
</ul>
</li>
</ul>
</body>
</html>
我觉得我的这个不算答案，不过好像太长了，就放答案里头。@stephenLee 来瞅瞅
我试着在
if(judge)的条件执行语句分别加一句console.log(fields.style.display+" over");和console.log(fields.style.display+" out")来识别事件,在出现的
li元素之间上下移动，会有block和none交替输出(不是很规律),但是如果在同一个li左右移动，确实火狐在闪烁。题主最好注意一下
mousemove和mouseout,前者只要鼠标在元素内部移动就会重复触发，后者鼠标离开元素上方到移入其他元素就会触发，其他元素可以是内部子元素也可以是外部元素我注意到一个特别的地方就是在同一个
li水平移动，一般只触发mousemove事件，可是mouseout只有firefox触发，我猜想这里firefox是把元素的文本也当成是元素的子元素了，所以会触发。还有就是交替触发了
mousemove和mouseout，似乎也只有firefox才会闪烁，chrome和ie似乎闪的非常快以至于我没看出来有闪烁.