作って理解するAjax (2)：IT Pro
図2●作成したクライアントをテスト<br>クライアントから受信したデータをそのまま返送するサーバーを使ってテストした様子。入力データがそのまま表示されるのが分かります。 前回はAjaxの概念や利点を説明し，筆者が作成したAjaxアプリケーションを紹介しました。紹介したものの一つがインクリメンタル検索用アプリケーションです。検索ボタンをクリックして初めて検索される通常のWeb検索とは異なり，インクリメンタル検索はキーワードを1文字入力するたびに即座に検索を実行します。検索結果はKWICという形式で表示します（図1[拡大表示]）。KWICはKeyWord In Contextの略で，前後の文脈付きで検索結果を表示する形式です。 今回から2回にわたり，このインクリメンタル検索を実現するAjaxアプリケーションを作成します。単なる動作説明用の「おもちゃ的な」サンプルではなく，実用性のあるツールとし
Google Mapsでレーシング / 走っているように見える仕組み [tech.nitoyon.com]
Google Mapsで鈴鹿サーキット試走 で使っているテクニックを紹介します。 ゲームのソースを見てみてください。なんと、JavaScript 部分は70行ほどです。かなり少ないですよね。たった、70行でゲームを作れてしまうのは、これから説明するような単純な方法で実装しているからなんです。 実は動いていない車 ゲームをプレイしているといかにもドライブしているような感覚になりますが、実は車は回転するだけで、車の表示位置は変わっていません。動いているのは背景の地図だけなのです。 車の表示位置は動いていないのに、走っている感覚になるんですね。こういう表現って、8ビットゲーム機時代にはよくありました。たとえば、スーパーマリオでも、マリオが全速力で走っているときは、マリオの画面中の表示位置は変わらないまま、背景が動いているだけでした。 では、車はどうやって回転させているのでしょう。 バッファリング
![Google Mapsでレーシング / 走っているように見える仕組み [tech.nitoyon.com]](https://cdn-ak-scissors.b.st-hatena.com/image/square/0152b5a283748a3bce479101d22b9b4c157d2c27/height=288;version=1;width=512/https%3A%2F%2Ftech.nitoyon.com%2Fapple-touch-icon-114x114.png){kind=icon}
Bridge Word
This shop will be powered by Are you the store owner? Log in here
JKL.Floating - フローティングエレメント（ドラッグ移動）
エレメントをマウスでドラッグして移動できます。 Internet Explorer 6.0、 Firefox 1.0、 Opera 8.0 で動作確認をしています。 ダウンロード JKL.Floating は、下記アーカイブ中の jkl-floating.js 単独で動作します。 JKL シリーズのその他の .js ファイルの併用は必須ではありません。 jkl-floating-0.03.tar.gz TAR-GZ jkl-floating-0.03.lzh LZH .tar.gz 版と .lzh 版の内容は同じです。（アーカイブ形式のみ違う） サンプル1 シンプルにエレメント全体を掴んで移動できるサンプルです。 簡単なメッセージ表示などに利用できます。 ドラッグ移動中は半透明（透過率50％）となります。 var float1 = new JKL.Floating("area1"); fl
ほその日記 - フォームが変更された事を知る
今日の帰り道、小腹すいたなぁ…なんだか分からないけどむしょーにカップラーメンが食べたい！！と思った時には、自宅から一番近いコンビニを通り過ぎていて、戻るのもめんどくさかったので新たなコンビニを探す旅に出ました。 駅から自宅に向かう道を、自宅を通り過ぎて探しに行く事に。いつもは駅方面しか行かないので新しいコンビニができてるかも!?と思って自転車を走らせるとそこには… 130戸のマンションとか、やたらゴージャスな家とか、綺麗な家とか山ほど見知らぬ景色が広がってました！おいおい、自宅から徒歩3分の所がこんなになってたのか！反対方向見るとまだ畑が広がっているというのに、高級っぽい住宅街ができてました。 これなら知らないコンビニがあってもおかしくない！ということでズンズン自転車をこぐと…一瞬で田舎に戻ったorz。開発されてる！と思った地域はほんのちょっとで、少し離れたら見知った景色が広がりだしました
テキストフィールドのフォーカス時に背景色を変更する JavaScript
■ テキストフィールドのフォーカス時に背景色を変更する JavaScript 以下の JavaScript を読み込ませれば、フォームのテキストフィールドにフォーカスした時に、背景に色がつくようになります。今どのフィールドを選択しているのかが視覚的にわかるので便利。 mixi にこの機能がついていたんだけど、onfocus なんてのをいっぱい書いていて非効率的だと思ったので、読み込ませるだけで勝手に全部のフィールドに設定されるようなものを書いてみました。 window.onload = function() { var colorful = new ColorfulInput; colorful.set(); } function ColorfulInput() { this.skip = []; this.color = { 'blur': '', 'focus': '#EEEEEE'
最速インターフェース研究会 :: 実践JavaScriptリファクタリング
同じ事をやるにも、いろんな書き方があるわけでいかにして短くてわかりやすいコードを書くかというノウハウを紹介します。 例として"abcde"を80回繰り返した文字列を作るとして実際に自分のコーディングスタイルがどんな風に変化していったのか、という。 短くなるのは確かなんだけどわかりやすいかというと、人によるかもしれない。 グローバル関数を定義2年前なら、多分こういう具合だった。 //ふつうに関数として定義する function x(str,num){ var tmp = ""; for(var i=0;i<num;i++){ tmp += str; } return tmp; } x("abcde",80) Stringのメソッドとして定義1年前だとこんな感じ。 //Stringのメソッドとして定義する String.prototype.x = function(num){ var tmp
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IT戦記
Mozilla — 利益ではなく、ユーザーのためのインターネット
Mozilla の DOM/JavaScript
『オブジェクトなJSの基礎講座』
MU-LIB js_mu_focus