<div id="growDiv"></div>
<select id="combobox">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>0</option>
</select>
<script>
$('#growDiv').on('mouseover', function (){
$(this).css('height', '200px');
}).on('mouseout', function (){
$(this).css('height', '75px');
})
</script>
<style>
#growDiv {
width: 300px;
height: 50px;
background-color: gold;
position: absolute;
z-index: 1000;
}
#combobox {
margin-top: 75px;
}
</style>
您可以在以下位置看到它: http://jsfiddle.net/dHN2K/
在 Safari 中,如果我展开下拉选项然后将“悬停”在黄色的 div 上,选项会保持在顶部......我该如何解决这个问题?
我也试过 $('select').remove();但它仍然存在!!
谢谢!
最佳答案
您可以在鼠标悬停时隐藏选择。 http://jsfiddle.net/dHN2K/2/
查看我所做的更改。
$('#growDiv').on('mouseover', function (){
$(this).css('height', '200px');
$("#combobox").hide();
}).on('mouseout', function (){
$(this).css('height', '75px');
$("#combobox").show();
})
关于javascript - 在 Safari 中,下拉选项位于顶部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14874566/