jquery/css jqueryでIEを表示するには

Question

私はjqueryでホバー機能を作っています。すべてのFireFoxとChromeで正常に動作し、問題はIEにあります。私はCSSの上/左を変更し、divを可視にするためにjquery.showを使います。初めてIE上に置かれても、間違った位置に表示されます。二回目は、それが...

var x = (e.pageX - this.offsetLeft) - $(this).next("div").width(); 
var y = e.pageY - this.offsetTop; 



$(this).next("div").css({ display: 'block', 'position': 'fixed', zIndex: 2, left: x, top: y }); 

$(this).next("div").show("slow"); 

は再び、それはChromeとFirefoxのが、IEで素晴らしい作品..うまく示し

が、これはのdivのは、それを隠すために、デフォルトで持っているCSSです（私はIE9をテストしました） ：あなたがxを計算する際のdivが完全にロードされていないため

display:none; 
position:fixed; 
z-index:2; 

Answer 1

あなたはこの問題に実行されています。 jQueryはdivの幅が何であるか分からず、したがって0を返します。次回はdivがロードされ、jQueryが幅を正しく取得します。

leftの代わりにrightを設定することでこれを修正できます。これは私の意見では、同様のアニメーションを向上させます。

次のdivにクラスを追加し、 `css`ファイルにそのクラスにCSSクラス定義を与えないのはなぜ

http://jsfiddle.net/gilly3/gup8u/22/

$('.linkin').hover(function(e) { 
    var x = document.documentElement.offsetWidth - e.pageX; 
    var y = e.pageY; 

    $(this).next("div").css({ 
     right: x, 
     top: y 
    }).stop(true, true).show("slow"); 
}, 
function() { 
    $(this).next().addClass('tooltip').stop(true, true).hide("slow"); 
});