Top > Blog > CrossBrowser

FirefoxでCSS, JSの読み込みエラーが発生する事がある

先日開発中のサイトを動作確認していたら、ページにjQueryを読み込ませた途端に、Firefoxでの表示が変になりました。
どうも4つあるCSSのうち、1つだけが読み込まれていないようです。ついでにjQueryのライブラリファイルも読み込まれていないので、動作しません。

IE6では問題なかったので、jQueryの読み込ませ方が悪いのかと、いろいろ試してみました。

最初は↓

  <script language="JavaScript"
    type="text/javascript"
    src="/js/jquery-1.3.2.min.js"></script>(実際は1行)
これは動作しません。jquery-1.3.2.min.js の中身が問題なのかと思い、jquery-1.3.2.js をダウンロードしてきて、
  <script language="JavaScript"
    type="text/javascript"
    src="/js/jquery-1.3.2.js"></script>
にしましたが、同じです。

では…、という事で jquery-1.3.2.js のファイル名を変更して、jquery.js にし、

  <script language="JavaScript"
    type="text/javascript"
    src="/js/jquery.js"></script>
にしたら、jQueryファイルは読み込んで、ちゃんと動作しました。

しかし、CSSは読み込まれないまま。という事は、jQueryの問題ではなく、Firefoxに問題が…?
残念ながら CSS に手を加えたかどうかは、記憶が定かではありません。FTPで再アップロードはしましたが、その際に何か勝手に変換されたか…
こんな時は、Google先生!

WeBlogZine: Mozilla系ブラウザでCSS読込エラー

古い記事なので古いFirefoxの話のようですが、試します。
確認用サーバーは.htaccessが使えるので、

AddType text/css .css
AddHandler server-parsed .css
AddType text/javascript .js
AddHandler server-parsed .js
を追記したら、動きました。CSSもちゃんと読み込みました。という事はこれが諸悪の根源?

今回はFirefox3.0.7(Windows XP sp3)でしたが、古いブラウザで問題を回避する為にも、上記のようにMIMEタイプをきちんと設定するのは正しい解決策だと思います。

ただ、

  • 全てのCSSが読み込めないわけではなかった。
  • jQueryも”uncompressed code”で、かつファイル名を変更したら読み込めたのがなぜだか不明。
ではあります…

全2コメント

  1. firefoxにイライラ より:

    最新版のfirefoxでも同様のことが起こっています。
    jqueryの一部分が効かなくなることが多々あります。
    firefoxだけおかしくなるのでゴミブラウザ確定ですね

なんと、Webサーバーの設定とは | 正(まさ)やんの一発逆転 へのコメント