jQuery(バージョン1.6.2)を使用して、FF3 +、IE9、および現行バージョンのChromeとOperaでうまく動作するアニメーションを生成します古いバージョンはスタンドアロンとして見つけられません)。jQuery(v1.6.2)はIE7とIE8のスタンドアロン版でエラーを返します
IE7とIE8のスタンドアロン版では、FireBugで確認した後、jQueryライブラリが機能していないようです。Invalid argument: jquery-latest.js, line 18 character 20327
これは?a.elem.style[a.prop]=
に対応しています。
私はこれがスタンドアロンバージョンのIEに問題があると想定していますが、現在確認する方法はありません。私が使用しているスタンドアロンパッケージは、http://utilu.com IEコレクションです。
私はまた、<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
を追加しようとしましたが、成功しませんでした。
のjQueryコード:
$(document).ready(function(){
$("nav menu a").click(function(){
var oArticle = $("#" + $(this).attr("class"));
oArticle.fadeIn({
duration: 2500,
queue: false
}).animate({
width: "500px",
height: "auto"
}, {
duration: 2500,
queue: false,
easing: 'linear',
complete: function(){
$("header").css("height", oArticle.css("height"));
}
});
return false;
});
});
と、対応するマークアップ:
<nav>
<menu>
<li><a href="about.htm" class="profile">Profile</a></li>
<li><a href="contact.htm" class="contact">Contact</a></li>
<li><a href="projects.htm" class="projects">Project Gallery</a></li>
<li><a href="resources.htm" class="resources">Resources</a></li>
</menu>
</nav>
その他、その後上記のスクリプトは、他のそのページから呼び出されて、他のJavaScriptコード、jQueryライブラリが存在しません(http://code.jquery.com/jquery-latest.pack.js
)。
これはおそらく、IEが好きではない値にCSSプロパティを設定しようとしたためです。アニメーション中に何か起きるかもしれませんし、 "header"要素の高さを設定しようとするかもしれません。私はあなたがその行動についてあまり説明しなかったので、どちらが分かっているのかわかりません。 – Pointy
はい、高さをautoから100%に変更して固定しました。ありがとうございます。 – silverstrike