我想在将鼠标悬停在文本框上时显示一个类似菜单的 div,但由于某种原因它没有显示。
这是我的CSS
.search:hover #search_drop {
display:block;
}
#search_drop {
display:none;
height:500px;
width:500px;
background:#000;
position:absolute;
top:0px;
}
这是html
<div id="navigation_s" style="float:left">
<ul >
<li >
<div class="search">
<div id="search_drop"> test </div>
<form action="" id="searchform">
<input type="text" name="search" id="searchbox" placeholder="looking for something?"/>
<input type="submit" id="searchbutton" value="go"/>
</form>
</div>
</li>
</ul>
</div>
我想做的就是将鼠标悬停在搜索上,应该显示 #search_drop 但它没有发生
最佳答案
您不能将鼠标悬停在未显示的节点上。
display:none
-> 它不在您的页面上。所以,你不能徘徊在这个上面。同样适用于隐藏
但是,我们可以改变其他属性。例如,
#search {
border : 1px green solid;
}
#search:hover {
border : 5px red solid;
}
<div id="search">
abcdefgh
abcdefgh
abcdefgh
</div>
关于javascript - 悬停时显示 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23057579/