jQueryの - 私は側面に欲しい何

// CSS 
#popupUser{width:180px; height:180px; position:absolute; background:#FFFFFF; border:#000000 2px solid; display:none;} 
.viewUser{width:173px; float:left; padding:10px; margin-left:20px; margin-bottom:20px; border:#000000 1px solid;}  

// HTML + Jquery 
<body> 
    <div class="contenitore"> 
     <script type="text/javascript"> 
      $(document).ready(function() {  
       $(".viewUser") 
        .mousemove(function (e) { 
         if($("#popupUser").css('display')=='none') { 
       $("#popupUser").css({left:e.pageX+15, top:e.pageY -190}).show(); 
          alert("None"); 
         } 
        }) 
        .mouseout(function() { 
        $("#popupUser").hide(); 
       });   
      }); 
     </script>  

     <div class="viewUser"> 
      Content 
     </div> 
    </div> 

    <div id="popupUser">&nbsp;</div> 
</body>

は私がマウスでviewUserのdiv に行くとき、アラートが示されている、ということ（どれもの.css（「表示」）プロパティのトラブル印刷されていない ）。その後、私がそのdivを残すまでは、の表示プロパティは、私が.show（）関数を呼び出すときにブロックと設定されている必要がありますので、別の警告を見たことがありません。jQueryの - 私は側面に欲しい何

しかし、実際には（私はまだビューユーザーをマウスで動かすと）アラートが表示されます。なぜこの動作？私がやりたいものを

乾杯実際に

UPDATE

はこれです：私はviewUser div要素にマウスに行くとき、私はへのAJAX呼び出しをやりますサーバーにいくつかの情報を取得し、popupUserに追加してください。だから、私はdivにマウスを動かすたびにこのajaxコールを呼び出さないでしょう:)

出典

2010-12-21 markzzz

あなたはどのブラウザでテストしていますか？ – PseudoNinja

Google Chrome 8.0.xxxxxx – markzzz

ため、ポップアップが表示され、その要素を追跡し、マウスに関連して、それを再配置したい場合は

..マウスは、それに.viewUser火災のマウスアウトであり、それは再び閉じるとき。

 $(document).ready(function() {  
      $(".viewUser") 
       .mousemove(function (e) { 
        var $popU = $("#popupUser"); 
        if($popU.css('display')=='none') { 
         $popU.show(); 
        } 
        $popU.css({left:e.clientX+2, top: e.clientY-2}); 
       }) 
       .mouseout(function() { 
       $("#popupUser").hide(); 
      });   
     });

デモ：（コメント後）http://www.jsfiddle.net/gaby/RQhTp/

ソリューションは、div要素を再配置すること自体が十分な時間を持つようにマウスアウトのタイムアウトを使用することです。..

$(document).ready(function() { $(".viewUser") .mouseenter(function(e){ $("#popupUser").show().css({left:e.clientX+1, top: e.clientY+1}); clearTimeout($(this).data('timeout')); }) .mousemove(function (e) { $("#popupUser").css({left:e.clientX+1, top: e.clientY+1}); }) .mouseleave(function() { $(this).data('timeout', setTimeout(function(){ $("#popupUser").hide(); }, 100)); }); });

デモ：http://www.jsfiddle.net/gaby/RQhTp/3/

出典

2010-12-21 16:56:41

あなたの例を見ると、ポップアップは "流動的"ではありません。それは時々それが消えているようだ:)この例を確認してください：http://jsfiddle.net/yEeyV/は完全に流体です – markzzz

+1本当に素敵なスニペット、それ！ –

@markzzzの場合、アラートによってマウスを移動させ、 'mouseout'イベントが発生します。 –

.mouseover()ではなく.mousemove()が必要です - mousemoveでは、その要素内でのマウスの動きをすべて追跡できます。マウスオーバーはマウスの最初の接触のためのものです。

出典

2010-12-21 16:49:15

今、mousemove（）が必要です。なぜなら、私はいくつかのdivがマウスに属していると表示したいからです:) – markzzz

jQueryの - 私は側面に欲しい何

答えて

関連する問題