0

これが私の関数です：

function dropmenu() {
    $(".dropdownitem").show('slow');
}
function hidemenu() {
    $(".dropdownitem").hide('slow');
}

そして、これが私のドロップダウンメニューです：

<div id="dropdown" class="ns" onmouseover="dropmenu()" onmouseout="hidemenu()">
    <p id="dropper">Shortcut Menu</p>
    <p class="dropdownitem">Shortcut menu item</p>
    <p class="dropdownitem">Something</p>
    <p class="dropdownitem">Seomthing else</p>
    <p class="dropdownitem">Test menu item</p>
    <p class="dropdownitem">More testing</p>
    <p class="dropdownitem">Stuff</p>
    <p class="dropdownitem">More stuff</p>
</div>

問題は、ショートカットメニューの上にマウスを置いたり外したりすると、上下、上下、上下に移動し続けることです。

何が問題ですか？

4

2 に答える 2

3

elclanrsの回答はバウンスを修正します。別の解決策は、ドロップダウンすることになっているdivにすべてを配置することです。

<div id="dropdown" class="ns" onmouseover="dropmenu()" onmouseout="hidemenu()">
<div class="dropdownshow">
  <p id="dropper">Shortcut Menu</p>
  <p class="dropdownitem">Shortcut menu item</p>
  <p class="dropdownitem">Something</p>
  <p class="dropdownitem">Seomthing else</p>
  <p class="dropdownitem">Test menu item</p>
  <p class="dropdownitem">More testing</p>
  <p class="dropdownitem">Stuff</p>
  <p class="dropdownitem">More stuff</p>
</div>
</div>

次に、ドロップダウンdiv全体を表示します

function dropmenu() {
$(".dropdownshow").show('slow');
 }

また

   $(document).on("mouseover", "div.overout" , function() {
   $(".dropdownshow").show('slow');    
     }).mouseout(function(){
        $(".dropdownshow").hide('slow');
     });

同時に7つの別々の要素にアニメーションを適用してバウンスを発生させる前は、これは1つにのみ適用されます。

于 2012-10-13T03:06:45.220 に答える
1

止まる

function dropmenu() {
    $(".dropdownitem").stop.(1,1).show('slow');
}
function hidemenu() {
    $(".dropdownitem").stop(1,1).hide('slow');
}
于 2012-10-13T03:03:56.407 に答える