• 締切済み

クロスブラウザ

HTML4.01,PHP5,javascript,CSS2,MySQL5 これらを使って、webサイトを作成しました。 FireFoxで検証し動作OK,となったところでブラウザをIE6に変えてみました。 そうすると、javascriptはエラーが出ていないにも関わらず、CSSは崩れてるわ、MySQLからデータは抽出できてないわ、という大変なことになっております。 非同期通信等でのクロスブラウザ対策は以下です。 XMLHttpRequest(),ActivXObject("Microsoft.XMLHTTP") addEventListener,attachEvent 何か他にしなければならないことがあるのでしょうか? ちなみにFireFoxのjavascriptコンソールにはエラーはありません。 情報が足りないと思いますが、ソースコードを全部ここに書いても意味ないと思いますので・・・ どなたかアドバイスありましたらお願いいたします。

みんなの回答

noname#19206
noname#19206
回答No.1

Firefox だそうですよ(前置き) http://www.mozilla-japan.org/support/firefox/faq#spell-abbreviate スクリプトはイマイチわかりませんが、IE と非 IE の表示状態の違いを理解すればレイアウトはある程度問題を解消できると思います。 http://www.mozilla.gr.jp/standards/webtips/index.html

first-try
質問者

お礼

ありがとうございました。 Firefox・・・確かにそのようです。 IEではやはりCSSの扱われ方が違うようですね。 CSSを調整してみます。

関連するQ&A

  • XMLHttpRequestのブラウザ対応

    JavaScriptで、あるURLの結果を取得しようと以下のようなスクリプトを組みました。 var xmlHttp = false; function loadText(){ xmlHttp = new XMLHttpRequest(); xmlHttp.open("GET", "http://hogehoge, true); xmlHttp.onreadystatechange = checkStatus; xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ res = xmlHttp.responseText; alert(res); } } IE8では、結果が取得できたのですが、firefox4.0.1,Chromeでは取得できませんでした。 xmlHttp.status が0となってしまいました。 ただし、GET対象のURLをローカルサーバにすると、取得することができました。 firefox4.0.1,Chromeのブラウザの設定なのでしょうか?それともスクリプトの書き方に問題があるのでしょうか? すみませんが、教えてください。

  • 従業員番号を入力すると氏名を表示させるというプログラムを作成しておりますが、エラーが出てしまいます。

    AJAX超初心者です。 従業員番号を入力すると非同期処理を行って社員マスタで検索した氏名を表示させたいのですが、エラーが出てしまい、煮詰まってしまいました。 エラーを解決する方法をどうかご教授ください。 【エラー】 document.getElementById("emp_no") is null ※emp_noがなぜ取得出来ないのかが分かりません。。。 【sample1.htm】 <script type="text/javascript" src="funcs.js"></script> <script type="text/javascript" > //<![CDATA[ function getEmpName(){ var emp_no = document.getElementById("emp_no").value; var emp_name; var httpObj = getHttpObject(); httpObj.open("GET", "sample1.php?emp_no=" + emp_no); httpObj.send(null); httpObj.onreadystatechange = function(){ if(httpObj.readystate == 4){ if(httpObj.status == 200){ emp_name = httpObj.responseText; document.getElementById("emp_name").value = emp_name; } } } } //]]> </script> <tr> <td>従業員番号:<input type="text" name="emp_no" onblur="getEmpName();" /></td> <td>従業員氏名:<input type="text" name="emp_name" id="emp_name" /> 【funcs.js】 function getHttpObject() { var xmlhttp; if (window.ActiveXobject){ try { xmlhttp = new ActiveXobject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } } }else if (window.XMLHttpRequest) { try { xmlhttp = new XMLHttpRequest(); } catch (e) { xmlhttp = false; } } return xmlhttp; } function addListener(eSrc, eType, eFunc, cap) { if(eSrc.attachEvent) { eSrc.attachEvent('on' + eType, eFunc); }else if(eSrc.addEventListener) { eSrc.addEventListener(eType, eFunc, cap); }else { alert('No support on your Browser'); return false; } } 【sample1.php】 <?php $emp_no = $_GET["emp_no"]; //データベースへ接続 mysql_query("set names utf8"); $result = mysql_query("select * from *** where *** = '$emp_no'"); $row=mysql_fetch_array($result, MYSQL_ASSOC); echo $row["emp_name"]; ?> 長々とソースを記載してしまい申し訳ございませんがどうぞ宜しくお願い致します。 補足 エラー表示された環境はFirebugになります。 どうぞ宜しくお願い致します。

    • ベストアンサー
    • AJAX
  • IE6 + javascript

    すみません、先ほども質問したのですが、締め切ってしまったのでもう一度質問させてください。 下記コードが、Firefoxでは動作するのですが、IEではjavasciptの部分が動作していません。 もちろん、javascriptの設定は有効にしてあります。 var browser = navigator.appName; if(browser.charAt(0) == "N") { window.addEventListener("load",change_page(page_id),false); } else if (browser.charAt(0) == "M") { window.attachEvent("onLoad",change_page(page_id)); } .... function httpRequest() { if (window.ActiveXObject) { try { httpObj = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { try { httpObj = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { httpObj = false; } } } else if (window.XMLHttpRequest){ try{ httpObj = new XMLHttpRequest(); } catch(e) { httpObj = false; } } return httpObj; } change_page()はfunctionです。 なぜIE6ではjavascriptが動かないのでしょう? ソースのどこが悪いのかわからず、どなたかアドバイスあればお願いします!

  • 【javascript 】addEventListenerでもattachEventでもないブラウザ

    http://www.dustindiaz.com/top-ten-javascript/ 上記に記載されている、addEvent()について教えてください。 以下は抜粋です。(行頭は全角スペースです。) function addEvent(elm, evType, fn, useCapture) {  if (elm.addEventListener) {   elm.addEventListener(evType, fn, useCapture);   return true;  }  else if (elm.attachEvent) {   var r = elm.attachEvent('on' + evType, fn);   return r;  }  else {   elm['on' + evType] = fn;  } } 質問1 elseになるブラウザって、どのようなブラウザがあるのでしょうか? ご存知でしたら教えてください。 質問2 elseになるような場合、イベントを削除するには下記の様になるのでしょうか? elm['on'+evtType] = function () { return false; }; 以上、よろしくお願いいたします。

  • JavaScriptのイベントハンドラ設定の方法

    要素(aタグなど)にイベントハンドラを設定する場合、 直接onclick等を書かずにaddEventListenerで追加するのが良いと聞きました。 しかしIEでは使えず、attachEventで設定する必要があります。 htmlとJavaScriptを分離するという意味では理解できるのですが、 http://java-script.seesaa.net/category/2504769-1.html の用に document.getElementById("hoge").onclick = function("hogehoge"); とする方が楽なんじゃないでしょうか? IEでもFirefoxでも動くので、addEventListenerの用にブラウザ毎に書く必要もありません。 前者を使うメリットは何なのでしょうか?

  • ブラウザやディスプレイによる見え方の違いをなくすには

    ホームページを作成しています。 IE、firefox、operaなどブラウザによっての見え方の違いをなくすのは cssで作るとあまり違いがなく表示できるというのはわかるのですが ディスプレイによる見え方の違いをなくすには特にjavascriptなどを 入れ込む必要があるのでしょうか? あるとしましたら、どのようなスクリプトなのか教えていただきたいです。 よろしくお願いいたします。

  • ブラウザによる表示の違い

    今サイトを作成しています。 HTML、CSSをはじめて1年の初心者です。 ブラウザは普段基本的にFirefoxを使用しています。 サイトの表示確認をFirefoxとIE7で行っているのですが2つのブラウザで微妙に表示がずれてしまいます。 色々調べてJavaScriptでブラウザを判別させてそれぞれに対応したページを用意するようなことが書かれていたんですがいまいちやり方がよくわかりません、、 やり方知ってる方助けてください。 もしくは他の対処法があるんでしたら教えていただけると助かります。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • ブラウザ依存のレイアウト・・・どうにかなりませんか?

    タグ自体もそうかもしれませんが、CSSを利用すると IEとFirefoxで全くレイアウトが異なります。 Mozilla側に合わせればいいと思ってやってたのですが、 片方に合わせると片方が崩れます。 しかもNetscape、Macブラウザなどでまた違うとか言われたら泣きます。 一体どうすれば良いのでしょうか? CSSは利用したいです。JavaScriptは利用しません。 利用しないほうがいいタグや属性などあるのでしょうか?

  • javascriptで困っています。教えてください

    以下のようにjavascriptの内容を書いた外部のテキストファイルを読み込んで、実行しようとしているのですが、うまくいきません。普通にjavascriptを読み込むのは分かっているのですが、このような方法ができないのでしょうか?よろしくお願いします。 <!doctype html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>無題ドキュメント</title> </head> <body> <div id="jsbox"></div> <script type="text/javascript"> var jsbox = document.getElementById("jsbox"); //非同期通信///////////////////////////////////////////// var xmlHttp; loadText(); function loadText(){ if (window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); }else{ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttp = null; } } xmlHttp.onreadystatechange = checkStatus; xmlHttp.open("GET", "http://xxxxxxxxxxxx/js_test.txt", true); xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var str = xmlHttp.responseText;alert(str); jsbox.innerHTML = str; test_js(); } } ///////////////////////////////////////////////////////////////// </script> </body> </html> テキストファイルをhttp://xxxxxxxxxxxx/js_test.txtに置き、テキストファイルの内容が <script type="text/javascript"> function test_js(){ alert("test"); } </script>

  • cssの今、一番旬なブラウザごとに違うcssをかける方法

    現在4つのブラウザでほぼ同じような動作・見栄えをするサイトを制作しております。 4つのブラウザとは(opera ie6 ie7 firefox)です。 そこで、現在、ie6だけで生じる表示崩れがあり、 そのcssの解決方法も発見したのですが、 それを解決すると今度は逆に、opera,ie7,firefoxでエラーが起きてしまいます。 読み込んでいるのは、一つの外部cssファイル、main.cssです。 現在考えられる解決方法としては、 1.ie6だけにcssを掛けるハック?  この場合、どのようにハックをかければいいのでしょうか。  色々しらべましたが、スターハックなど、現在使って良いハックというのは何になるのでしょうか。 具体的なcssコードは、以下です。 #pull a:hover{ display:block; /*以下ie6だけに指示したい命令 現状コメントアウトしています*/ /*margin-bottom:-20px;*/ } 2.ie6だけ別の外部cssファイルを読み込ませる。  ブラウザ毎に違うcssファイルを読み込ませることってできるのでしょうか。  (javascriptで判別するのでしょうか?) ie6 なら、main_ie6.cssを読み込み、 それ以外のブラウザなら main.cssを読み込ませる 一番ベストな方法を教えていただければと思います。

    • ベストアンサー
    • HTML