2012-04-29 10 views
2

「ポップアップ」クラスでdivを作成しようとしていますが、これは5秒間フェードインしてから「左」をホールドしたときにフェードアウトしますが、ホバリング。jquery show div最初のホバーでのみ

$(document).ready(function() {  
    $('.left').hover(function() { 
     if ($(this).hasData("hovered_once")==false) { 
      $('.popup').fadeIn(1000); 
      $(this).data("hovered_once")=="yes"; 
     } 
    }, 
    function() { 
     $('.popup').fadeOut(1000); 
    }); 
}); 
+4

いずれかを使用。 http://api.jquery.com/one/ –

+0

@LarryBattle。あなたは正しいですが、一部の人々はそれを難し​​い方法でやっているのが好きです。以下の答えを読んでください... – gdoron

+0

@gdoron、いくつかの人々は複数の方法で何かをすることを知りたいです。そのうちの1つが機能しない場合 –

答えて

3
$('.left').one('mouseenter', function() { 
    $('.popup').fadeIn(1000); 
}) 
.one('mouseleave', function() { 
    $('.popup').fadeOut(1000); 
}); 
+0

これは最もエレガントな答えのようです。私のサイトでは現在作業していません... [link](http://alpha.may-ninth.co.uk/work/) – Alfazo

0

あなたは、これは一度、すべての.LEFTの要素を適用したい場合は...これまでのところ私のコードですこのようにしてください。ここにサンプルコードがあります。

$(document).ready(function() { 
    var i=1; 
    $('.left').on({ 
     mouseenter: function (e) { 
      if(i<2) 
      { 
       $('.popup').fadeIn(1000); 
       i++; 
      } 
     }, 
     mouseleave: function (e) { 
      $('.popup').fadeOut(1000); 
     } 
    }); 

});​ 

サンプルデモ

http://jsfiddle.net/mediasoftpro/ZtWru/7/

+1

うわー。あまりにも多くのコード。 「1つ」はあなたのために(より効率的な方法で)あなたのためにそれを行います。私の答えを読んでください。 – gdoron

+0

はい 'ワン 'もこれに適しています。しかし、私は '.data'を使うのが好きです:) –

+0

あなたは' unbind' o.k.を使った場合でもハンドラがそこにとどまることを知っていますが、あなたのコードはまったくベストプラクティスではありません。 :( – gdoron

0

次のことができます。これは、あなたはそれがこのような.dataの()プロパティの使用することができ、

$(document).ready(function() { 
var i = 1; 
if (i == 1) { 
    $('.left').hover(function() { 
    $('.popup').fadeIn(1000); 
    }, 
    function() { 
     $('.popup').fadeOut(1000); 
    }); 
    i++; 
}; 
}); 
関連する問題