• ベストアンサー

ブラウザ毎の動き backgroundColor

各ブラウザでの動作が違う件について教えてもらえないでしょうか？ JavaScriptにて 「val = id.style.backgroundColor」 と記述したときの動作なのですが、 IEではカラーコード(数値)で帰ってきます。 FireFoxではカラーコード(文字列'RGG( R, G, B)')のように帰ってきます。 個人的にはIEのように数値で帰ってきてくれたほうがうれしいのです。 ですのでFireFoxの場合には数値に変換する処理を入れたらいいとは思いました。 ですが、他のブラウザでも帰ってくる方法違うとしたら困ってきます。 どのブラウザでも数値で取得するいい方法はないでしょうか？

質問者が選んだベストアンサー

  • ベストアンサー
  • VCAT
  • ベストアンサー率20% (16/79)
回答No.1

FireFoxにあわせたほうがいいのでは？ ＩＥがおかしいんです。 FireFoxのカラーコードは標準ですよ。

Missing0001
質問者

お礼

FireFoxの方が正しかったのですか・・・。 それではそのようにさせていただきます。 あと、ついでに質問させてもらいます。 文字列'RGB( R, G, B)'で帰ってくるものを数値に置き換える関数はあるのでしょうか？ なければ自作しますが・・・。

その他の回答 (1)

回答No.2

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <title>Q4061795 TestCase 1</title> <style type="text/css"> p{ background-color:rgb(255,0,0); } </style> <script type="text/javascript"> function sample1(){ alert(window.getComputedStyle(document.getElementById("hoge"),null).getPropertyCSSValue("background-color").getRGBColorValue().green.getFloatValue(1)); } function sample2(){ alert(window.getComputedStyle(document.getElementById("fuga"),null).getPropertyCSSValue("background-color").getRGBColorValue().red.getFloatValue(1)); } </script> </head> <body onload="sample1();"> <p id="hoge" style="background-color:rgb(0,255,0);">あああ</p> <p id="fuga" onclick="sample2();">いいい</p> </body> </html> <!-- 当方IE8なせいか再現せず,望みの状態かわかりませんが, 一応 http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-RGBColor Safari 3.1.1とMinefield 3.1a1pre(Firefox trunk)では Interface RGBColorを用いて,style要素,style属性共にR,G,Bそれぞれの値が取得できるようです。IE8 Beta 1では失敗しました。Opera 9.5で取得できない理由は不明です。 -->

Missing0001
質問者

お礼

回答ありがとうございます。 ですが自己解決しておりました・・・。 その状態で締め切るのを忘れてました、すみません。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • 【window.event.srcElement】のクロスブラウザ

    質問です。 window.event.srcElement の記述をすると、IEでは取得できるのですがFirefoxでは動作しません。 IE以外のブラウザで、取得する記述でなにかよい方法はありますか？ ※ちなみに、IDを取得してから、エレメントを取得する方法はわかるのですが、これだと、同じ動作をさせるのにIDをいくつも記述しなければならないのがネックなのです。 IDからでなく、直接、srcElementを参照したいのです。 宜しくお願い致します。

  • 各ブラウザでの動作確認

    もっと広義のカテゴリで質問するか悩んだのですがとりあえずこちらで（－－；） IE,NN,Safari,Opera,firefoxなど色々なブラウザがありJavascriptやStylesheetはブラウザによってうまく機能しなかったりスタイルが表示できなかったりすると今までの質問や回答、ネット検索でとりあえず知っているのですが・・・ 回答者様の中には『IE,Opera,firefoxで動作確認済み』などのように書かれておられる方も居るのですが個人(パソコン1台(Windows XPです))でこのように複数のブラウザで動作確認することは可能なのでしょうか？ 今現在perl,Javascript,Stylesheetを使って趣味の範囲でゲームを作成しています ですのでjavascriptが正常に機能しないと遊ぶことができません（＞＜） 複数のブラウザでの動作確認の仕方の方法を教えて頂きたいのですが・・・ アプリケーション(？)をデスクトップに置いてそれを確認したいときに起動させればいいのでしょうか？ その際、アプリケーション間の弊害などはないのでしょうか？ あと、NNは企業のようなところでない限りサポートする必要はあまり無いと書かれているのをたまに見かけるのですが・・・ どのブラウザを重点的にサポートしておけばいいのでしょうか？ IE,Opera,firefoxあたりですか？

  • 背景色を透明化

    スタイルシートで指定した背景色をJavaScriptで 透明にしたいと思うのですができませんでした ご存知の方いらっしゃいましたらおしえてください 必要と思われる部分をいかに記述します スタイルシート部 <DIV id="L1" style="background-color:pink"> こんにちは </DIV> JavaScript部 document.all.L1.style.backgroundColor="none"; 「none」にするとプロパティーエラーになってしまいます 透明というなにか特別な色コードがあるのでしょうか おしえてください。

  • クロスブラウザ

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

  • Javascriptでブラウザ振り分け。

    Javascriptでブラウザ振り分け。 Javascriptでブラウザの振り分けを行いたいと思います。 振り分けをする対象は 『IE7以前 <--> IE8以降』 サイトを徘徊して色々見て周ったのですが 一番簡単な方法として if(navigator.appVersion.indexOf("MSIE 5",0) != -1) alert("IE5ですね") の記述を見つけました。 が、上記のスクリプトはIE5のみを判定するスクリプトで IE7以下、IE8 の振り分けではなく困っています。 引数として文字列が返ってくるのであれば演算子を 『>』等では難しそうですし・・・。 良い方法はありませんでしょうか？ よろしくお願い致します。

  • ブラウザごとのJavaScriptの動き

    お世話になります。 IEの脆弱性問題に絡んで、他のブラウザでシステムの動きを調査することになりました。 （システム的にはIE限定で提供されています） で、日付（YYYY/MM/DD）をあるhidden項目にセットしているのですが cgiアプリでその日付を取得してチェックしているところで 「日付のフォーマットエラー」になってしまいます。 JavaScriptファイルに、 正しく取得できているかalertを入れてみました。 IEでは alert("1. " + parent.document.form1.HIZUKE.value) ; alert("2. " + document.form2.DATE.value) ; ↓ 1. 2014/04/30 2. 2014/04/30 firefox、operaでは ↓ 1. 114/04/30 2. 114/04/30 と表示されました。 parseInt、 toString()　の関連と思われるのですが 対処方法がわかりません。 また、chromeでは このエラーのせいなのか、parentのフレームの内容が表示されません。 ※parentの内容は、親フレームのonload処理で表示しています。 ※全てcgiアプリでボタンクリックによる動的な表示です。 以前、firefoxなどはJavaScriptは動かないと聞いた事ともあるような気がしますが、 IEと他のブラウザではJavaScriptの動きは違うのでしょうか？ またそれが提示されているサイトなどあるのでしょうか？ よろしくお願いします。

  • displayがブラウザによって正しく表示されない

    phpおよびhtmlに関する質問です。 今、tableを表示・非表示を表示ボタンと非表示ボタンを押すことで自由に開閉しようとしています。 document.getElementById('ｘｘｘ').style.displayを使って書いているのですが、 ChomeやSafariでは正しくボタンを押すと開閉されるのですが、それ以外のブラウザIE、Firefox、Operaでは真っ白な画面が表示されるだけで上手く表示されません。 実際には以下の様に書いています。 <a href="javascript:document.getElementById('ｘｘｘｘ').style.display = ''"> <img src="aaaa.jpg" alt="表示する"/> </a> <a href="javascript:document.getElementById('ｘｘｘｘ').style.display = 'none'"> <img src="bbbb.jpg" alt="表示しない"/> </a> 表示されるブラウザと表示されないブラウザの違いの一つとしてアドレスバー にて、表示される方は同じアドレスが出ている状態でtableが表示されます。 表示されない方は、アドレスバーに「javascript:document.getElementById('ｘｘｘｘ').style.display = ''」 とそのままaタグの内容が表示されてしまいます。 また、この記述がされるページは読み込み時にjavascriptですべてのtableをnoneで表示しない設定 にしており、これについてはすべてのブラウザがいずれも表示しない状態でページ表示が完了します。 IEやFirefoxでもボタンの開閉が上手くできるようにするにはどのようにしたらよろしいでしょうか？ 現在の各ブラウザのバージョンは以下のとおりです。 Chome：26.0　Safari：5.1.7　IＥ：8.0 Ｆｉｒｅｆｏｘ：19.0.2　Opera：12.15

    • ベストアンサー
    • PHP
  • ユーザーによってJavaScriptの動きが違う

    WindowsXPを３人で使用しています。 ブラウザは、３人ともFireFox3.5を使用しています。 全部のユーザーのブラウザのJavaScriptは有効になっていますが、 私のユーザー名でログインしたときだけ、あるサイトのページのJavaScriptが動作しません。 試しにIE7でも試しましたが、同様の結果になりました。 キャッシュの問題かと思い、一時ファイルを削除してもダメでした。 どうすれば解決できるのでしょうか？

  • ブラウザによって変換されるのですか？

    「ＩＥ11からはjavaScriptのソースが ie独自形式からfirefox形式に変更されている」 と見たのですが、 同じjavaScriptのソースでも ブラウザによって変換されるのですか？

  • Javascriptで各ブラウザを厳密に区別する方法

    JsvascriptでIE,FireFox,Safari,Opera,Chromeのそれぞれのブラウザを厳密に区別する方法が知りたいです。 それが困難な場合はIE/FireFoxとその他のブラウザを区別する方法がわかれば構いません。 最近Javascriptを触っていませんが2008年後半から今までで何かJavascriptで変化したことはあるのでしょうか？ 2007年はAjaxというものが出てきましたが、その後 目新しいものがあったでしょうか？それとも今は減少中？

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する