1

ホバー効果で 1 つの要素が他のすべての要素とは逆のトグル状態になるという断続的な問題が見つかりましたが、毎回発生しているわけではありません。

div のグリッド内のどの要素が最初に mouseenter/mouseleave されるかに依存しているようです:

  $('#portfolio li').hover(function(){
        $(this).find('.info').stop(false, false).animate({
            height: ['toggle', 'swing'],
            opacity: 'toggle'
        }, 300, 'linear');
  });

グリッドはページの本文に表示され、最初の 1 つまたは 2 つの div がマウス入力されるタイミングに応じて「スティッキー」が表示されます。

( true,true ) ( true, false ) などのさまざまな組み合わせは、この最初のホバーされた div がスティッキーになるのを止めません (ただし、毎回ではありません)。

以下の画像に見られるように、2 つの div が同時にホバリングされていますが、これは決して発生してはなりません。

ここに画像の説明を入力

4

1 に答える 1

1

解決策 (友人から指示された) は、単一のホバー イベントとtoggleパラメーターを一意のイベントmouseenterとイベントに置き換えることでしたmouseleave。これが最終的なコード ソリューションです。

  $('#portfolio li').mouseenter(function(){
        $(this).find('.info').not(":animated").stop(true, true).animate({
            height: ['show', 'swing'],
            opacity: '1'
        }, 300, 'linear');
  });

  $('#portfolio li').mouseleave(function(){
        $(this).find('.info').stop(false, true).animate({
            height: ['hide', 'swing'],
            opacity: '0'
        }, 300, 'linear');
  });
于 2013-11-09T09:47:40.493 に答える