2011-02-08 11 views
2

こんにちは私は、マウスが移動したときに要素をスライドさせてから、マウスを外にスライドさせて隠したいと思います。このコードはありますが、最初のマウスセンター機能が完了しました。.entry_extend divに表示されます。私はホバー機能にしようとしましたが、同じ問題です。助けてください..ありがとうございます。jQueryのホバリングの問題

jQuery("document").ready(function(){ 
        jQuery(".fire").mouseenter(function(){ 
         jQuery(this).children('.entry_extend').stop(true, false).show('slide',null,500,null); 

        }); 
        jQuery(".fire").mouseleave(function(){ 
         jQuery(this).children('.entry_extend').stop(true, false).hide('slide',null,500,null); 
        }); 

       }); 


<div id="craft" class="fire"> 
     <div class="entry_main"> 
      <a href="" title=""> 
      <img src="" alt="" /> 
      </a> 
     </div> 
     <div id="entry_ex_craft" class="entry_extend"> 
      <a href="" title="">original shisha pipe collection</a> 
    </div> 
</div> 

マウスオーバー+ MouseEnterイベントとマウスアウト+バインディングを使用mouseleaveを組み合わせる:)

+0

これをテストしているマークアップを投稿できますか? – Loktar

+0

あなたのHTMLは本当に役に立ちます – heymrcarter

+0

良い点..私は – simekadam

答えて

1

あなたは "ホバー" を実装しようとしています。これは動作します:

jQuery(".fire").hover(
    function(){jQuery('.entry_extend', this).stop(true, true).show(500);} 
    , 
    function(){jQuery('.entry_extend', this).stop(true, true).hide(500);} 
); 

マインドをあなたはDIVを非表示にすると、それを含むDIVの境界を変更するので、あなたが上でホバリングしているDIV内に出入りスライドさDIVを持つことは良い考えではありません。このために、時には「震える」活動に終わることもあります。

+0

ああ..クール..おかげさま...しかし、 .entry_extend 'は私のページのこれらの要素のすべてを選択しませんか?私はこのセレクタが私がより明確な要素を選択していることを意味すると思った。私が間違っている?確かに私は:) – simekadam

+0

セレクタの2番目のパラメータ( '.entry_extend'、this)は、 "this"で指し示された要素の中でのみ "entry_entend"のクラスを持つ要素を探します。 "this"要素。これは "children( '。entry_extend')"メソッドを使用するのと同じですが、(私の意見では)使いやすくなっています。例えば、 "jQuery( 'div。 "jQuery( 'div')。children( '。tabs')"よりも優れています。 – Neil

0

試みを助けてください.. hereを参照してください。

jQuery("document").ready(function(){ 
        jQuery(".fire").bind('mouseover mousenter',function(){ 
         jQuery(this).children('.entry_extend').stop(true, false).show('slide',null,500,null); 

        }); 
        jQuery(".fire").bind('mouseout mouseleave',function(){ 
         jQuery(this).children('.entry_extend').stop(true, false).hide('slide',null,500,null); 
        }); 

       });