ブラウザがInternet Explorerの場合は、別のjqueryスクリプトをロードしますか？

Question

私は特にInternet Explorerで作成しているレイアウトに大きな問題を抱えています。私はボーダーとパディングがあるときにIEが幅と高さを違う方法で変換することを知っているので、私のCSSにはMozillaとChromeのようにIE内で同じように見えるようにするコードが含まれていました。

jqueryアニメーションがナビゲーション上で実行されているのですが、Mozilla/GoogleコードとIEの詳細。私はいくつかのサイトを見回しましたが、高さパラメータを持つ別のjqueryファイルを作成してIEでナビゲーションをきれいに見せるようにしましたが、何らかの理由でIEがiemenu.jsの代わりにmenu.jsから抜けています

異なるビットのコードを持ついくつかのサイトでは、IEがmenu.jsではなくiemenu.jsを読み込ませ、他のブラウザではmenu.jsを読み込ませます。残念ながら、何らかの理由でIEはiemenu.jsを読み込まず、代わりにmenu.jsを読み込みます。

私はまた私もdidntの仕事ことがわかっ

<!--[if IE 9]> 
<script type="text/javascript" src="iemenu.js"></script> 
<![endif]--> 

別のを試してみました

<script type="text/javascript">var runFancy = true;</script> 
<script>runFancy = true;</script> 
<!--[if IE]> 
<script type="text/javascript"> 
runFancy = false; 
</script> // <script type="text/javascript" src="iemenu.js"></script> 
<![endif]--> 

<script type="text/javascript" src="menu.js"></script> 

を試してみました：

<!--[if lt IE 9]> 
<script type="text/javascript" src="iemenu.js"></script> 
<![endif]--> 

は私がいるもう一つの問題は、アニメーションですこれはナビゲーションの高さが縮小され、その後マウスが取り除かれたときに通常のサイズに戻ります。私がテキストを少し下に移動させるためにCSSにパディングを含めると、すごく不思議です。私はパディングなしでこれをテストし、アニメーションは正常に動作しますが、テキストの約半分がアニメーションを終了した後に切り取られます。私はまた、不具合の問題を解決していないhoverintentプラグインを使ってみました。ここで

は、ナビゲーションCSSのサンプルです：

.nav1 { 
width:96px; 
bottom:0; 
right: 311px; 
height:45px; 
font-size:20px; 
font-family:Verdana, Geneva, sans-serif; 
color:#ffffff; 
padding-top:15px; 
padding-bottom:0px; 
display: inline-block; 
position:absolute; 
text-align:center; 
border:1px solid; 
border-bottom:0px; 
border-color:#000000; 
background: url("images/navbg.jpg") no-repeat; 
} 

* html .nav1 { 
\width: 96px; /* for IE5 and IE6 in quirks mode */ 
w\idth: 98px; /* for IE6 in standards mode */ 
\height: 61px; /* for IE5 and IE6 in quirks mode */ 
h\eight: 62px; /* for IE6 in standards mode */ 
} 

そしてここでは、jQueryのコードです。 iemenu.jsとmenu.jsの両方が同じに組み込まれている、彼らはただの高さに異なる値を持っている：私は本の中で、ほぼすべてのIEのフィクサーのトリックを試してみました

$(function() { 

$('.nav1').hover(function() { 
    $(this).stop().animate({height:30, right: 311}, 300); 
}, function() { 
    $(this).stop().animate({height:45, right: 311}, 300); 
}); 

$('.nav2').hover(function() { 
    $(this).stop().animate({height:30, right: 408}, 300); 
}, function() { 
    $(this).stop().animate({height:45, right: 408}, 300); 
}); 

    $('.nav3').hover(function() { 
    $(this).stop().animate({height:30, right: 505}, 300); 
}, function() { 
    $(this).stop().animate({height:45, right: 505}, 300); 
}); 


    $('.nav4').hover(function() { 
    $(this).stop().animate({height:30, right: 602}, 300); 
}, function() { 
    $(this).stop().animate({height:45, right: 602}, 300); 
}); 



}); 

私が知っているとオンラインの両方ここでは、その他に発見しましたそれは場合に役立ちます参考のために、私は私の他のスクリプト、HTMLの後と

Answer 1

はこのようにそれを試してみてください。関数が同じであれば、ie関数は "normal"関数を上書きして動作します。

Answer 2

前であればIEのコードを入れてきたサイトと何がこれまで動作しているようだ....私は、また、IE 7

に取り組みますあなたの必要性$.browser

if ($.browser.msie) { 
    alert("this is ie!"); 
} 

スクリプトの

あなたが最後の例

<script type="text/javascript" src="iemenu.js"> 
    if ($.browser.msie) { 
     $.getScript('iemenu.js', function() {}); 
    } 
</script> 

Answer 3

ので$.getScript

$.getScript('ajax/test.js', function() { 
    alert('Load was performed.'); 
}); 

を使用することができますロードする場合、それはいずれにもないので、あなたのmenu.jsは、常にロードされます。あなたの関数を上書きすると、正方形に戻ります。

解決方法メニューを最初に読み込むことはできますが、それはちょっとしたハックです。この場合menu.jsが最初にロードされ、iemenu.jsが後でロードされますで

<script type="text/javascript">var runFancy = true;</script> 
<script>runFancy = true;</script> 
<script type="text/javascript" src="menu.js"></script> 
<!--[if IE]> 
<script type="text/javascript"> 
runFancy = false; 
</script> // <script type="text/javascript" src="iemenu.js"></script> 
<![endif]--> 

：まだ

Answer 4

jQuery.browserが推奨されていないため、不正行為を検出し、可能であればjQuery.supportを使用してください。

Answer 5

私の考えでは、受け入れられた答えのように、2つのスクリプトを読み込んでコードを上書きする方がよりクリーンで正確です。このコードiemenu.jsで

は、IE9次いで以下IEのバージョンであり、他の場合には、IE9-10-11または任意の他のブラウザのように、それはmenu.js

<!--[if lt IE 9]> 
    <script src="iemenu.js"></script> 
<![endif]--> 
<!--[if gte IE 9]><!--> 
    <script src="menu.js"></script> 
<!--<![endif]--> 

をロードする場合にのみロードされますここで

はjQueryの2つの異なるバージョンについての例と議論です： http://www.impressivewebs.com/loading-different-jquery-version-ie6-8/

たぶん私は後半の答えとね:) ...