ブラウザの言語をJavascriptから調べる。
Photo by midnightglory 多言語対応のサイトを作っていると問題になるのが、メッセージの切り替えです。PHPやRailsを使っている場合は、HTTP_ACCEPT_LANGUAGEを見てメッセージ生成を切り替えれば良いのですが、静的ファイルの場合は、そうは行きません。 そこで、今回はJavascriptだけでブラウザの言語を取得する方法を調べてみました。 ググっていると、ブラウザ依存ですが取得する方法が見つかったので、各ブラウザで検証した所、navigator.browserLanguage、navigator.language、navigator.userLanguageのいずれかで取得できることが分りました。 ただ、この値はブラウザのデフォルト言語環境のなので、HTTP_ACCEPT_LANGUAGEとは違う値が返ってきます。たとえば、日本語OSに英語版のFirefo
型変換のルール(文字列、数値、論理値)
JavaScript で使用される色々なデータ型の値は、必要に応じて自動的に型が変換されます。例えば文字列に対して別のデータ型の値を + 演算子で連結しようとすると自動的に文字列に変換された上で連結が行われます。ここでは型変換が行われるときにどのように数値や文字列などに変換されるのかについて解説します。
UrlEncode.net URLエンコード
UrlEncode.netはURLエンコードしたい文字列をエンコードし、デコードしたい文字列をデコードするツールです。
HTMLタグ/フォームタグ/チェックボックスを作る - TAG index
type="checkbox" （チェックボックスを作成） type属性の値に checkbox を指定すると、チェックボックスを作成できます。 name="" （部品の名前を指定） フォーム部品を識別するための名前を指定します。 複数のチェックボックスに同じ部品名を付けることで、1つのグループを作ることができます。チェックボックスでは、そのグループの中から複数を選択することができます。 この属性の値は、value属性の値とセットで送信されることになります。 value="" （送信される文字列を指定） この属性の値は、そのチェックボックスが選択されている時に送信されることになります。 チェックボックスには、このvalue属性が必須となります。 checked （選択された状態を指定） この属性を指定したチェックボックスは、最初から選択された状態になります。 その他の属性 以下の属性で、部
逆引きクイックリファレンス JavaScript
<html> <head> <title>Sample</title> <script type="text/javascript"><!-- function check(fObj) { alert(fObj.checked); } // --></script> </head> <body> チェックボックスの状態を調べます。 <form> <input type="checkbox" name="osType1">Linux<br> <input type="checkbox" name="osType2" checked>Macintosh<br> <input type="checkbox" name="osType3">Windows<br> <input type="button" value="チェックボックス１の状態を表示する" onClick="check(this.f
CSSセレクタ20個のおさらい
CSSセレクタって意外と分かっていなかったりするので勉強ついでにまとめてみました。比較的実用的かなと思うものを20個紹介していきます。いい復習になればと思います。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 また、IEが対応しきれていないCSS3のセレクタもありますが、IE6～8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」 で紹介したようにCSS3セレクタはie対策も容易なのでぜひお試しください。 SelectivizrはCSSを外部ファイルで指定した方がいいのですが、今回のサンプルはCSSを外部ファイル
保存版！CSS3セレクタの説明書
CSSセレクタについての基礎知識 このブログで何回も説明していますが、念のために説明します。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 セレクタ表の説明には属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 あと親子関係や兄弟関係などもあまり聞きなれないかもしれません。下の階層にある要素との関係が親子関係で、同じ階層にある要素同士の関係が兄弟関係です。 あと、CSS3と聞いて「どうせIE8以下はダメだし使えない」と思う方もいるかもしれませんが、セレクタに関しては簡単に対応できます。 IE6～8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」をご参考に。 それ
<LABEL>−HTMLタグリファレンス
<LABEL>タグはフォームの構成部品（一行テキストボックス・チェックボックス・ラジオボタン等）と、 その項目名（ラベル）を明確に関連付けるための要素です。 これによりチェックボックスやラジオボタンでは、 関連付けられたテキスト部分をクリックしてもチェックを付けることができるようになります。 <LABEL>タグの使用方法は2通りあります。 1つは<LABEL>タグのfor属性の値と、フォーム部品のid属性の値を同じものにすることで両者を関連付ける方法です。 もう1つは<LABEL>～</LABEL>内にフォーム部品とテキストを含める方法です。後者の方法は、Internet Explorer5や6には対応していないようなので、できるだけ前者を用いた方が良いでしょう。 accesskey属性はショートカットキーを割り当てる際に使用します。指定できる値は文字セットの中の任意の1文字です。 Win
CSS 3のセレクタ：最初と最後、偶数と奇数の要素にスタイルシートを適用 - builder by ZDNet Japan
今回から、CSS 3の草案「Selectors」で新しく追加されたセレクタについて紹介していきたい。これまでCSS 3のセレクタに十分に対応しているのはOperaだけだったが、FirefoxがFirefox 3.1（ベータ版）で、SafariもSafari 3.1で対応を進めたことにより、Internet Explorerを除く主要なブラウザで利用できるようになった。 今回は、「:first-child」と「:last-child」、「:nth-child()」と「:nth-last-child()」を紹介する。これらのセレクタを利用すると、最初と最後の要素や、指定したナンバーの要素、さらには奇数と偶数の要素に対してスタイルシートを適用することができる。そのため、これまでのように余計な やクラス名を追加することなく、さまざまなデザインを設定できるようになる。 たとえば、こうしたセレクタを利
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
JS Bin
Online HTML editor