1

要素にすばやくカーソルを合わせると要素が非表示にならないため、問題が発生しています。ゆっくり/通常のホバリングを行うと、意図したとおりに機能します。これが私のjQueryです：

$(".A").mouseenter(function(){
    $("#arrow").hide();
    $('.1').fadeIn('fast');
}).mouseleave(function(){
    $('.1').hide();
    $("#arrow").fadeIn('fast');
}); 

$(".B").mouseenter(function(){
    $("#arrow").hide();
    $('.2').fadeIn('fast');
}).mouseleave(function(){
    $('.2').hide();
    $("#arrow").fadeIn('fast');
}); 

$(".C").mouseenter(function(){
    $("#arrow").hide();
    $('.3').fadeIn('fast');
}).mouseleave(function(){
    $('.3').hide();
    $("#arrow").fadeIn('fast');
});

そして、これが私のhtmlです：

<div class="three columns arrow_father">
    <img id="arrow" src="images/graph.png" alt="" />
    <img class='rec_img hidden 1' src='img1.jpg' alt='caption 3' data-caption='#htmlCaption3' />
    <img class='rec_img hidden 2' src='img2.jpg' alt='caption 3' data-caption='#htmlCaption3' />
    <img class='rec_img hidden 3' src='img3.jpg' alt='caption 3' data-caption='#htmlCaption3' />
</div>

PS：私はjQueryを台無しにしたと確信しており、jQueryを短く/きれいに/きれいにする方法が必要です。提案をいただければ幸いです;）

4

2 に答える 2

1

たとえば、新しいアニメーションを開始する前に、以前にキューに入れられたすべてのアニメーションを停止します。

$("#arrow").stop(true, true).hide();
$('.1').stop(true, true).fadeIn('fast');
于 2012-10-29T21:30:28.567 に答える
0

私は最初にあなたimgをに入れる方が良いと思います<a id="" href=""><img/></a>、それで例えばあなたはこのコードを書くことができます：

   $(document).ready(function(){
   $("#").click(function(){
   $("").show();
   });
   });
于 2012-10-29T21:47:13.233 に答える