$('#d11,#d12').on('mouseover',function(){ $('#d2').animate({opacity:'100'}); });
で同じマウスオーバーで2つの要素間を移動する問題 コードにあるように、d11とd12の間を移動するとanimateがオブジェクトの点滅を実行します。詳細なコードは以下の通りです:
Document <script> $(document).ready(function(){ $(&#39;#d11,#d12&#39;).on(&#39;mouseover&#39;,function(){ $(&#39;#d2&#39;).animate({opacity:&#39;100&#39;}); }); $('#d11,#d12').on('mouseout',function(){ $('#d2').animate({opacity:'0'}); }); }); </script>
// 先终断之前的动画$(document).ready(function(){ $('#d11,#d12').on('mouseover',function(){ $('#d2').stop(true).animate({opacity:'100'}); }); $('#d11,#d12').on('mouseout',function(){ $('#d2').stop(true).animate({opacity:'0'}); }); });
方法1:
jsは必要ないのでCSSに文を追加します:
#d1:hover~#d2{opacity:1}
ただし、d1幅に注意する必要があります...
方法2:
Add新しいclass.opa1{opacity:1}を作成し、addClassとremoveClassで実行します。
アニメートする前にアニメーションを停止してください。または、カプセル化された .hover() を使用します
以上がjQueryで同じマウスオーバーで2つの要素間を移動する問題の解決策の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。