將鼠標懸停在div上，然后通過css sprite更改其顏色，然后淡入另一個div？

Question

我不太擅長編寫代碼，但是我想知道如何像這樣編寫javascript：

首先，將div懸停在div（下面的'#menu1 a' ）中，並通過CSS Sprite更改其顏色。

接下來，同時我要淡入它附近的另一個div('#menu1_submenu') ('#menu1 a') 。

$(document).ready(function()
{$('#menu1 a').hover(
function(){ 
        $('#menu1 a').css('background-position', '0 -30px');
        $('#menu1_submenu').fadeIn('slow');
},
function(){
        $('#menu1 a').css('background-position', '0 30px');
        $('#menu1_submenu').fadeOut('slow');
}
);
});

我要說的第二個功能是當鼠標離開div('#menu1 a') 。 當鼠標關閉時，我想將'#menu1 a ”移回第一位置，因此我在此處寫了'0 30px' 。 這個可以嗎？

哦，還有另一件事我想問你們：

當'#menu1 a'懸停並出現“＃menu1-submenu”時，即使鼠標從'#menu1 a' '#menu1_submenu' ，我也要保持'#menu1_submenu'出現，因為第二個div是一個子菜單。 這意味着，當鼠標離開'#menu1_submenu' ，它最終將淡出。 您如何設置？

你能幫幫我嗎？ :)

Answer 1

最好的方法是將子菜單置於懸停元素內。

<div id="menu1">
  <a>Menu
    <div class="submenu">
        submenu
    </div>
  </a>
</div>

看看這個小提琴： http : //jsfiddle.net/ewN3k/