Hallo,
hover arbeitet mit mouseover- und mouseout-Events. Diese passieren nicht nur beim Überfahren des Elements, sondern zudem beim Überfahren der Kindelemente. Die Ereignisse steigen auf (Bubbling) und lösen dort das Öffnen/Schließen auf, obwohl die Maus gar nicht den Bereich des Elements verlassen hat.
Als Alternative kannst du mit den Events mouseenter und mouseleave arbeiten:
http://api.jquery.com/mouseenter/
http://api.jquery.com/mouseleave/Diese bubblen nicht und passieren erst, wenn die Maus wirklich das Element verlässt.
Mathias
Hallo, bist du sicher, dass das Problem mit dem Bubbling zusammenhängt? Ich denke eher, dass er die Combobox dann nicht mehr als Bestandteil des Divs sieht?
Trotzdem habe ich deinen Vorschlag ausprobiert. Leider zeigt der Code das gleiche Verhalten wie zuvor auch.
Viele Grüße
Luxury
<!DOCTYPE HTML>
<html>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>
<style type="text/css">
.test{
background:red;
width:200px;
height:100px;
}
.menu{
position:relative;
top:100px;
height:300px;
width:200px;
background:green;
display:none;
}
</style>
<body>
<div class="test">
<div class="menu">
<select>
<option>o1</option>
<option>o2</option>
</select>
</div>
<script type="text/javascript">
$('.test').mouseenter(function(){
$('.menu').show();
});
$('.test').mouseleave(function(){
$('.menu').hide();
});
$('.menu').mouseenter(function(){
$('.menu').show();
});
$('.menu').mouseleave(function(){
$('.menu').hide();
});
</script>
</body>
</html>