JavaScript
2016年9月1日更新:ストリートビュー画像の有無を API で取得できることが分かったので書き直しましたGoogle Maps JavaScript API v3 では次のようにして、指定した div 要素に任意の地点のストリートビューを表示することができる。 // ストリートビューを…
HTML 5 で導入された Web Storage ではブラウザに数 MB 程度ほどのデータを保存できる。仕様上は他のタブやウィンドウでデータが変更されると storage イベントが発生することになっているが、ブラウザによっては多少癖のあるものも存在する。各ブラウザの癖…
最近のブラウザでは toLocaleString() メソッドが用意されているのでそれを使う。 Number.prototype.toLocaleString が実装されていない場合や、(1).toLocaleString() の結果がなぜか "1.00" になってしまうブラウザでは次の代替関数を用いる。 if (!Number.…
JavaScript でアプリを作るとき、入力文字の正規化を行って利用者の負担を減らそう。 全角文字 Unicode の Halfwidth and Fullwidth Forms Block のうち、ASCII コードと対応している 94 の文字を置換する。 str.replace(/[!-〜]/g, function(s) { return S…
ゼロ埋めするために次のコードを書いたら Internet Explorer 8 以下ではうまくいかなかった。 var num = 12; ("0" + num).substr(-2); // IE8では "012" このような場合は substr(start[, length]) を使わずに slice(begin[, end]) を使う。 var num = 12; (…
JavaScript のコードをチェックしてくれる JSHint というツールを導入した。 Node.js と JSHint のインストール こちらを参考にした。かんたん。 Windows に JSHintをインストールしてみた - かわちょでぶろぐ JSHint の設定 ホームディレクトリ (Windows の…
2013年12月12日に Zepto.js 1.1.2 がリリースされました (リリースノート)。v1.1 以降は IE10 に対応するなど、動作が異なる可能性があります。App Framework は jQuery 互換のライブラリとして作られた jqMobi から派生し、改良を加えながら現在に至る。 Gi…
ノードの種類は node.nodeType で取得できる。 var node = document.body.firstChild; console.log(node.nodeType); 比較は Node オブジェクトに定義された定数を使って行える。 console.log(node.nodeType === Node.TEXT_NODE); Internet Explorer 8 以前で…
Google Maps JavaScript API v3 を使ったところ次のような例外が発生した。 Uncaught InvalidValueError: invalid argument to setZoom: 15 コードは次の通り。div 要素に設定された属性 data-lat, data-lng から中心の座標、 data-zoom から縮尺を取得して…
先日 Android 4 の標準ブラウザには、メディアクエリに使われる device-width/height が CSS ピクセルではなくデバイスピクセル値として扱われてしまうバグがあることを紹介した。 Android 4 に存在する device-width/height のバグ - メモ用紙 今回、同様の…
HTML 5 や CSS 3 の新機能を使う場合、古いブラウザでも誤解なく内容が伝わるよう努めるべきだ。Safari, Chrome, Firefox, Opera の場合、自動アップデート機能やユーザのリテラシーの高さゆえ、古いバージョンを使い続けていることは少ない。そもそもバージ…
大昔の「prototype.js の Object 汚染」を思い出した。 http://la.ma.la/blog/diary_200507101154.htm 後に追記されたようだが、 Array.forEach に倣ってきちんと書くとこうなる。 (function(global) { Object.prototype.forEach = function(callback, conte…
2013年11月現在、jqMobi は App Framework へ、Zepto は v1.0rc1 から v1.0 (正式版) へとバージョンアップしています。最新版 App Framework, Zepto.js 1.0 と jQuery との互換性 をご覧ください。jQuery と互換性があり、とっても軽い JavaScript ライブラ…
Camino 2.1a1pre (Gecko 1.9.2, like Firefox 3.6.6pre) を使っていて、テキストボックスの内容に応じて自動的にサイズを調整するスクリプトが動かなくなっていた。調べてみると、そのスクリプトはkeypressおよびkeyupイベントが発生したときに処理を行って…
undefined typeof undefined → "undefined" undefined === undefined → true undefined == null → true undefined == 0 → false undefined == false → false void x → undefined null typeof null → "object" null === null → true null == 0 → false null =…
push/pop, shift/unshift, sort, reverse, splice は破壊的 join は値が undefined または null の要素を無視する [] を使って配列を書く場合 最後の要素区切り , は無視される(最近のJavaScriptでは) 区切りと区切りの間に何も書かないとその要素は定義さ…
桜ヶ丘さん作のこのスクリプト、JavaScriptで直接色を指定するのはちょっと嫌だったのでクラスを指定して、CSSでスタイルを指定できるようにしました。 入力プロンプトを表示するjQueryプラグインを書いたよ - 桜ヶ丘日記 引数に何も指定しないときは placeh…
vds はWebアプリケーションから使える音声合成APIです。 vds - ホームページ音声読み上げサービスを提供しています。音声読み上げサービスは、インターネットに誰もが使いやすい手すりをつけるをコンセプトにサービスを提供しています。 チュートリアルはこ…
忘れないうちにメモ。JW PlayerはFlashを使った動画・音声プレーヤー。 The Most Powerful & Flexible Video Platform | JW Player 下ごしらえ まず window.playerReady という関数を作りプレーヤーのオブジェクトを取得する。 var player; window.playerRea…