2008年04月02日06:00 カテゴリLightweight Languages Ajax - Ricollab郵便番号検索+Google Map 早速混ぜてみた。 ricollab Web Tech Blog ? Blog Archive ? ricollab実験サービス第一弾を開始します! 本日より、ricollabの語源の一つである「リコーラボ」としての活動の第一弾、郵便番号検索サービスを開始します。 ricollab 郵便番号検索 Google マップ API の概念 - Google マップ API - Google Code 〒 半角数字7けた 住所 郵便番号を7桁入力すると、対応する住所が住所欄に入ります。そのままでよければsubmit、そうでなければ微調整(たとえば番地も入力)してsubmitすると、地図が切り替わります。 Google Map APIも、jsapi と
はてなさんがダイアリーのAtomPubインターフェースをリリースしていました。 私は AtomPub が大好きなので、少しだけ試してみました。簡単にレビューを書こうと思ってエントリを起したのですが、意外と長くなりそうなので3部構成でお送りします。まずは実装編です。 認証 とりあえず普通のGETリクエストをサービス文書に送ってみます。http://d.hatena.ne.jp/{hatena-id}/atom がサービス文書の URI です。 GET http://d.hatena.ne.jp/yohei/atom HTTP/1.1 Accept: */* Host: d.hatena.ne.jp HTTP/1.0 401 Unauthorized Date: Fri, 19 Sep 2008 07:00:10 GMT Server: Apache/2.2.3 (CentOS) WWW-Au
このサービスで提供するリソースは、以下の3種類の表現を持ちます。 XHTML Media Type: application/xhtml+xml; charset=utf-8 標準的な Web ブラウザで表示することのできる形式です。ブラウザで表示させることが可能なので、人間が読みやすいのが特徴です。この表現は整形式の XML であるため、XML パーサーでパースして、プログラムから扱うことも可能です。住所の構造情報は class 属性で表現されています。全てのリソースのデフォルト表現になっています。 この表現は妥当な XHTML 1.1 になるはずですが、あえて DOCTYPE 宣言は付けていません。文字エンコーディングスキームは UTF-8 です。 http://zip.ricollab.jp/1120002 http://zip.ricollab.jp/search?q=大手町 ht
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ?'); }, function(){ $(this).text('ヌー'); } );
20日に発表されたGoogleの新しいWeb API、Google AJAX Language APIは、誰でも簡単に言語の翻訳を行えるようにするJavaScript APIだ。同APIを使うと、JavaScript文字列に対して「日本語←→英語」や「中国語←→英語」と言った変換を簡単に行えるのみならず、文字列が何語で書かれているかを自動判別することもできる。 同APIのパワーがどれほどのものかというと、以下のような翻訳サイトを10分足らずで作れてしまったほどだ(ソースコードは次ページで解説)。 非常にシンプルなAPI(メソッド2つしかない!)にも関わらず、そのパワーがあまりに凄まじすぎる。この興奮をぜひ皆さんにもお伝えしたいと思う。 ということで、さっそくLanguage APIの使い方を学んでいこう。
Script.aculo.usには、Ajaxを利用した動作を行うコンポーネントが存在する。今回はそれを紹介したい。バージョンは引き続き1.8.1だ。オプションなどの詳細はWikiページを参照していただきたい。なお、実行画面はIE7で示す。 ローカルデータで自動補完 - Autocompleter.Local まず、Ajaxとはいってもサーバにはアクセスせず、JavaScriptプログラム内に持ち合わせたデータで自動補完を行うAutocompleter.Localから紹介しよう。 自動補完とは、ユーザーがフィールドにデータの一部を入力したら、実際のデータの候補をフィールドの近くで自動的に表示させるものだ。 図1は、ユーザーが「Ja」まで入力しているとき、候補として「Java」「JavaScript」の2つを示しているところだ。これらはクリックや矢印キーで選択できる。こうすることで、ユーザーは
22日(米国時間)、Ajaxアプリケーション開発向けの統合開発環境を提供しているAptanaは、新しいサーバプロダクトとしてAptana Jaxerを公開した。Aptana Jaxerは同社が「真のAjaxサーバ」と謳うプロダクト。クライアントサイドもサーバサイドも同じようにHTML+JavaScriptのコードが実行できるというものだが、これまでのサーバクライアント技術になれてきたデベロッパにとってはいまいち想像しにくいところがあった。 Aptana Jaxerがリリースされた翌日となる23日(米国)には、さっそくMozilla Foundation, JavaScript Evangelist, John Resig氏によってAptana Jaxerを使うためのサンプルコードが紹介された。jQueryの開発者である同氏はAptana JaxerにおいてjQueryを使う簡単なサンプルコ
Ajax/JavaScriptライブラリをまとめておきます。(順不同) | 基本 | 統合 | 表示系 | GUI部品 | イメージ | PGM連携 | ブラウザ | Flash | その他 | | 部品集 | リンク | 編集履歴 | ・基本ライブラリ ・・・Ajax開発のベースになるもの ↑TOP prototype.js 超メジャーなAjaxライブラリ prototype.js の開発者向けメモ prototype.jsリファレンス prototype.jsリファレンス(JavaScriptist) prototype.js逆引きサンプル集 Prototype 1.5.0 Cheat Sheet Prototype 1.5 PDF - API/サンプル/解説 Prototype.js Documentation - まとめサイト Prototype 1.6.0へのアップグレード実例紹
Ajaxの弱点を補うscript.aculo.usの楽しいエフェクト:パターンとライブラリで作るAjaxおいしいレシピ(4)(1/4 ページ) script.aculo.usの一歩進んだテクニック 今回紹介するscript.aculo.usは、以下のような機能を提供するAjax(JavaScript)フレームワークです。 ビジュアルエフェクト ドラッグ&ドロップ DOM操作 オートコンプリート スライダー 単体テスト prototype.jsをベースのライブラリに使用しているので、prototype.jsとともに利用したことがある方も多いのではないでしょうか。 今回はscripot.aculo.usのエフェクト機能に焦点を絞り、より突っ込んだ使い方を紹介していきます。 ■ Ajaxの弱点を補う「エフェクト」の必要性 Ajaxを活用することで、画面全体を再描画せずに画面上の一部分のみを変更し
Ajaxパワーの活用方法 Ajaxは、ウェブアプリケーションの開発方法や利用方法を大きく変えた破壊的な技術だ。Ajaxによってインタラクティブなページの作成が可能になったのである。Ajaxは現在もウェブの流行の最先端を走り続けている。 Ajaxという用語は比較的最近生まれたものだが、Ajaxを支えている技術は以前から存在していた。ブラウザに送られたウェブページの内容をあとから変更する機能自体は、何年も前からあったのである。たとえば、JavaScriptでiframeのsrc属性を変更するのもそのような技術の一つだ。 しかし、XMLHttpRequestオブジェクトが主要なブラウザで実装され、GmailやGoogle Mapsが公開され始めると、開発者はそれをきっかけとしてウェブページの構築方法をもう一度考えるようになったのである。 XMLHttpRequestオブジェクト Ajaxを可能に
noupeにエントリーされている、AJAXを使った素晴らしいCSSのフォームの47のサンプルの紹介です。
ページ上で動かしたマウスの軌跡を記録し、再生することが可能になるJavaScriptやAJAXなどの組み合わせデモが公開されています。実際に試してみればわかりますが、記録している際には、特に記録されていると気づくような要素は全くありません。 応用としては、広告バナーのクリックについてアイトラッキング(目の動きを追う)の代わりに、マウスの移動する軌跡を記録して「マウストラッキング」が可能になったり、あるいはAJAXをフルに駆使したサイトにおけるユーザービリティの記録による操作の改善、あるいは各種スパイ行動などにも使えます。 実際のデモは以下から。 Record mouse movement using Javascript and AJAX http://pure.rednoize.com/movelogger/ 上記ページで四角いキューブの辺の周囲をマウスでなんどかぐるぐると回転させてみた
Introduction The documentation for the ExtReact product diverges somewhat from the documentation of other Sencha products. The sections below describe documentation for all products except where indicated as unique to ExtReact. Terms, Icons, and Labels Many classes have shortcut names used when creating (instantiating) a class with a configuration object. The shortcut name is referred to as an ali
LiveValidationPHP | Home What is LiveValidationPHP? Well in short it's a form validation script. PHPでフォームの値をリアルタイムチェック「LiveValidationPHP」。 PHPとJavaScript でリアルタイムにバリデーションする仕組みが公開されました。 次のようにフォーム内容をリアルタイムにバリデーションできます。 バリデートのルールなんかはPHPで記述でき、JavaScript に慣れていなくても使えます。 関連エントリ JavaScriptでリアルタイム値チェックを簡単に行える「LiveValidation」
それは何? prototype.js は Sam Stephenson によって書かれた JavaScript ライブラリです。 この熟考の上記述された標準に準拠したコードは、Web 2.0 において特徴となるリッチでインタラクティブなウェブページを制作する際の重荷を、あなたの肩から取り去ってくれるでしょう。 もしこのライブラリを使ったことがあるなら、充実したドキュメントがこのライブラリの売りではないことに気がついたはずです。 私は他の開発者と同様に、ソースコードを読み、試行錯誤しながら prototype.js を理解しました。 自分が学んでいる間にメモを取り、それを他の人たちと共有することは価値があるのでは、と考えたのです。 加えて、このライブラリによって提供されているオブジェクト、クラス、関数、拡張機能についての 非公式リファレンス も提供しています。 ここで提供する例とリファレンス
jQuery 開発者向けのメモです. ずっと以前に,jQuery に関する日本語の情報がまだ少ない頃に作ったページですが, その後 jQuery を再び利用する機会があったので,最新バージョン向けに記述を更新しました. 住宅ローンシミュレーションです. jQueryを利用したフォームの動的な追加や,flotプラグインによるグラフ描画などを行っています. 本ページの記載に間違い等見つけた方はブログのエントリまで連絡いただけるとうれしいです. 最終更新:2009/1/10 jQueryとは jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです. 独自のXPATH/CSSセレクタを利用することで,多くのDOM操作を非常に簡単に書くことが出来ます. JavaScriptのDOM操作や,XMLHTTPRequest,XMLの操作などを覚えなくとも, Ajaxを利用したイ
前回の「ブログの☆の総数を取得できるAPIを組み込みました」では、はじめてJSONPを使ってみました。以下、実際にJSONPを使ってみての覚え書きと、これからJSONPプログラミングをはじめる方へのTIPSです。 ブログの☆の総数を取得できるAPIは、はてなスターに登録されたブログの情報を取得できるJSON形式とJSONP形式で提供されているAPIでした。 はてなスター日記 - ブログの☆の総数を取得できるAPIを追加しました JSONとは、JavaScriptにおけるオブジェクトの表記法をほぼそのまま利用したデータフォーマットのことで、JSONPはJSONにちょっと記述を加えて、クロスドメインのJSONデータを非同期で読み込ませて処理するための手法のことです。(詳しい定義については、自分で調べてみてください) 通常、Webブラウザでは他ドメインのJavaScriptのデータを読み込んで実
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く