0

ホバーメソッドがアタッチされているアイテムが1つあり、ホバーするとその上に別のdivが表示されます...残念ながら、上のdivが表示されると、アクションがやり直されます（同じクラスを追加して実際に固定するため）その周り）

$(document).ready(function(){

    $(".cartHover").hover(
      function () {
        $("#uniquename4").fadeIn();
      }, 
      function () {
        $("#uniquename4").fadeOut();
      }
    );
  });

だから私は<div class="cartHover">ホバーディスプレイにそれを持っています<div id="uniquename4" class="cartHover">が、それはフェードインを2回行います。助けてください！

4

3 に答える 3

2

だから、持っている方が良いのではないでしょうか：

CSS

<div id="someID" class="cartHover">
  <div id="someId" class="showMe">
  </div>
</div>

<div id="someID" class="cartHover">
  <div id="someId" class="showMe">
  </div>
</div>

jQuery

$(function(){
  $('.cartHover').mouseenter(function(){
    $(this).find('.showMe').show();
  }).mouseleave(function(){
    $(this).find('.showMe').hide();
  });
});
于 2009-09-16T23:02:44.747 に答える
2

アニメーションキューを積み上げたくない場合は、そこにも.stop（）を含める必要があります。

$(function(){
  $('.cartHover').mouseenter(function(){
    $(this).find('.showMe').stop().show();
  }).mouseleave(function(){
    $(this).find('.showMe').stop().hide();
  });
});
于 2012-01-27T19:51:18.173 に答える
1

簡単な答え。ここで何をしているのか見てください。クラスcartHoverには2つのdivがあります。したがって、最初のdivにカーソルを合わせると、＃uniquename4が表示されます。uniquename4が表示されたら、それをホバーすると、再びフェードインします。それはすべてセレクターと関係があり、クラスcartHoverを使用して要素のすべてのインスタンスにホバーイベントをバインドしています。この選択には、デフォルトで表示されるdivとホバーに表示される＃uniquename4の両方が含まれます。私は次のようなものを提案します：

<div id="showSomething" class="cart-class">Content</div>
<div id="toBeShown" class="cart-class">Content</div>

$(document).ready(function() {
    $('#showSomething').hover(
         function() {
            $('#toBeShown').fadeIn();
         },
         function() {
             $('#toBeShown').fadeOut();
         }
     );
});
于 2009-09-16T23:05:34.600 に答える