在Chrome中，如果jquery中存在重复的悬停（），则只应用一个

Question

jQuery( document ).ready(
 function($) {
      $('.ppro').hover(
        function () {
            $('#pronav ul').css("height", "25px");
        },
        function () {
            $('#pronav ul').css("height", "0px");
        }
    );

    $('.pproj').hover(
        function () {
            $('#pronav ul').css("height", "50px");
        },
        function () {
            $('#pronav ul').css("height", "0px");
        }
    );
  });

这是我的jquery。

<div class="product-menu-bar-contrain">
 <nav id="pronav">
  <ul>
   <li class = "ppro">~~~~~</li>
   <li class = "pproj">~~~~~</li>
  </ul>
 </nav>
</div>

这是我的HTML代码。

将光标升高到ppro会将高度更改为25px。但是，当我将光标放在pproj上时，高度不会改变。它在IE中工作正常，但Chrome存在问题。

.pproj:hover a {
    color : #f2b221;
}

此CSS代码在IE和Chrome上均可正常使用。