jQueryを利用したWebサイトを作成しました。 http://lowrence.littlemarchen.jp/

様々なブラウザでテストした結果、IEもしくはIEベースのブラウザでは以下のエラーが出ます。
>>
メッセージ: 引数が無効です。
ライン: 113
文字: 478
コード: 0
URI: http://lowrence.littlemarchen.jp/scripts/jquery.js
<<
Firefox/Chrome/Safari/Operaでは全く問題ありませんでした。
色々いじってみた結果、自分で書いた"index.js"に問題がありそうなのですが、イマイチ原因が特定できません。
原因を特定して解決してくださった方には、別にポイントを支払おうと思います。
以下のアプロダにサイト全体をzipで固めてアップしました。
よろしければお使いください。
http://www1.axfc.net/uploader/Sc/so/83704
Pass:hatena

回答の条件
  • 1人2回まで
  • 13歳以上
  • 登録:2010/02/16 16:28:23
  • 終了:2010/02/17 23:02:07

ベストアンサー

id:y-kawaz No.1

y-kawaz回答回数1421ベストアンサー獲得回数2262010/02/16 18:11:15

ポイント50pt

ちょっと見てみましたがどうやら jquery.center.js のバグのようですね。

var paddingTop = parseInt($self.css("padding-top"));
var paddingBottom = parseInt($self.css("padding-bottom"));

↑これを、↓このように修正してやればとりあえず動くようになると思います。

var paddingTop = parseInt($self.css("padding-top")) || 0;
var paddingBottom = parseInt($self.css("padding-bottom")) || 0;

IEの場合、$self.css("padding-bottom") で 'medium' という文字列が帰ってきてしまうため、parseInt に失敗して paddingTop と paddingBottom に NaN が入ってしまいます。その結果、最終的に marginTop に NaN を代入しようとして不正なスタイル値の代入としてエラーが発生してるようです。

上記の修正は parseInt に失敗したときに NaN ではなく 0 が入るようにしています。

id:Lowrence

回答ありがとうございます。

jquery.center.js を書き換えてテストしてみたのですが、相変わらずIEではエラーが出てしまいページが表示できませんでした。

Firefox等では依然として問題なく表示できているのですが…

何が原因なんでしょう…orz

2010/02/16 23:53:12

その他の回答(1件)

id:y-kawaz No.1

y-kawaz回答回数1421ベストアンサー獲得回数2262010/02/16 18:11:15ここでベストアンサー

ポイント50pt

ちょっと見てみましたがどうやら jquery.center.js のバグのようですね。

var paddingTop = parseInt($self.css("padding-top"));
var paddingBottom = parseInt($self.css("padding-bottom"));

↑これを、↓このように修正してやればとりあえず動くようになると思います。

var paddingTop = parseInt($self.css("padding-top")) || 0;
var paddingBottom = parseInt($self.css("padding-bottom")) || 0;

IEの場合、$self.css("padding-bottom") で 'medium' という文字列が帰ってきてしまうため、parseInt に失敗して paddingTop と paddingBottom に NaN が入ってしまいます。その結果、最終的に marginTop に NaN を代入しようとして不正なスタイル値の代入としてエラーが発生してるようです。

上記の修正は parseInt に失敗したときに NaN ではなく 0 が入るようにしています。

id:Lowrence

回答ありがとうございます。

jquery.center.js を書き換えてテストしてみたのですが、相変わらずIEではエラーが出てしまいページが表示できませんでした。

Firefox等では依然として問題なく表示できているのですが…

何が原因なんでしょう…orz

2010/02/16 23:53:12
id:Cherenkov No.2

Cherenkov回答回数1503ベストアンサー獲得回数4932010/02/16 22:38:19

ポイント50pt

borderのほうですね。

var borderTop = parseInt($self.css("border-top-width")) || 0;
var borderBottom = parseInt($self.css("border-bottom-width")) || 0;
  • id:y-kawaz
    あ、すみません。自分のとこでは動いたのになーと確認したら、コピペ範囲を間違えてたことに気がつきました(^^;
    padding-top、padding-bottom じゃなくて、border-top-width と border-bottom-width の部分でした。
    修正が必要な個所は↓こっちです。

    var borderTop = parseInt($self.css("border-top-width")) || 0;
    var borderBottom = parseInt($self.css("border-bottom-width")) || 0;
  • id:Lowrence
    そちらの方を訂正したら、無事に表示できるようになりました!
    jquery.center.js は、どなたかが書いて公開しているものをダウンロードして使っていたので、それがIEで表示出来ない原因になっているとは驚きでした!
    そもそもjavascriptの知識が無いまま使い始めたために・・・orz
    色々とありがとうございました!
  • id:Cherenkov
    今後のデバッグに役立つかもしれない補足を。。
    (1)怪しいコードを見つけてコメントアウトして正しく動作するかテストする。
    「//一行コメント」「/*コメント*/」

    (2)IEのデバッガを使って見た目から探す方法
    IEで問題のindex.htmlを開いてから
    IEのメニュー - ツール - 開発者ツール を起動して
    HTML、CSS、スクリプト、と並んでいるところのスクリプトを開いて「デバッグ開始」ボタンを押します。
    すると質問文と同じ部分でエラーが報告されます。
    次に「続行」ボタンを押すとIEで表示されると思います。
    しかし垂直方向のcenterが効いていないのでjquery.center.jsを疑うことができます。

    (3)対策の方法
    index.jsでプラグインのオプション部分を省略せず以下のようにして
    true/false切り替えて試すことで原因の絞り込みができます。
    $("#container").center({
    vertical: false,
    horizontal: true
    });
    verticalを無効にすると正しく動くのでjquery.center.jsでvertical関連の箇所を見つけて
    alert(halfHeight)
    とコードを追加して正しい値が取れているか順に確認していきます。
    すると1番の回答が導き出されます。
  • id:Lowrence
    お二人ともありがとうございました。
    無事、IEでの表示に成功しました。
    今回、お二人とも私が困っていた問題を解決してくださいましたが、y-kawazさんの方がわずかに早くコメント欄にて解決法を提示してくださったので「いるか賞」はy-kawazさんのほうへ贈らせていただきました。
    今回のポイントとは別に少しですが、後日送らせていただきます。
    -------------------------------------------------------------------------------
    質問内容とは少しずれるのですが、IEで無事表示できるようになったWebサイトに関して、jQueryによるアニメーションがIEだと非常に汚くなってしまいます。
    これはIE側の仕様なのでしょうか。
    もしよろしければ、コメント欄にて教えていただけないでしょうか。
  • id:Cherenkov
    IEは透過pngとanimate()が苦手みたいですね。
    下のもぐらメニューも下に潜っちゃうし。
    以下を読めば原因がわかるかもしれません。
    http://d.hatena.ne.jp/ofk/20080916/1221531369
    http://scianto.net/archives/2009/08/09214844.php
    せっかくjQueryで作ってるのに残念ですね。

この質問への反応(ブックマークコメント)

トラックバック

  • ろーれんすのつぶやきろぐ。 - Tweets on 02/16 Tuesday ろーれんすのつぶやきろぐ。 2010-02-17 02:51:38
    12:18&#160;&#160;@25Re ごめんなさいっ! &#160;[in reply to 25Re] 12:20&#160;&#160;ふぁぼりのチェックはどこですればいいんやー。 12:20&#160;&#160;favstarはなんか嫌なんだよう 12:22&#160;&#160;@Shiba_ 本当だ! &#16
  • ろーれんすのつぶやきろぐ。 - Tweets on 03/21 Sunday ろーれんすのつぶやきろぐ。 2010-03-22 02:53:28
    01:02&#160;&#160;@nakimcyg そうだと良いけれども。 &#160;[in reply to nakimcyg] 01:11&#160;&#160;俺の部屋だと圏外になったりするソフトバンク爆発しろ!! 01:11&#160;&#160;でも、ソフトバンクが爆発したiPhone
「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません