AjaxZip 2.0
Kawa.netxp AjaxZip 2.0 - Ajax郵便番号→住所自動入力フォーム（CGI不要版） AjaxZip2は、昨年公開した 『ajaxな住所入力フォーム』 の新バージョンです。 郵便番号を入力すると、該当する都道府県名・住所が自動的に入力されます。 Ajaxと JSON フォーマットを利用するJavaScriptライブラリとして公開しました。 JavaScript のみで稼動するため、サーバサイドで稼動するCGIプログラムは不要です。 郵便番号→住所変換処理は全てクライアントサイドのJavaScriptで行います。 既存 HTML の住所入力フォームをたった3行書き換えるだけで利用できます。 簡単に設置できるため、プログラムに詳しくない方でも導入していただけると思います。 以下の住所入力フォームに、7桁の郵便番号を入力してみてください。 【2007/12/09 追記】 jQ
タブ、ツールチップなどクールなＵＩコンポーネント実装jQueryプラグイン「jQuery TOOLS」:phpspot開発日誌
タブ、ツールチップなどクールなＵＩコンポーネント実装jQueryプラグイン「jQuery TOOLS」 2009年06月16日- jQuery TOOLS - The missing UI library for the Web タブ、ツールチップなどクールなＵＩコンポーネント実装jQueryプラグイン「jQuery TOOLS」。 同様のライブラリは他にあるかもしれませんが、アニメーションや見た目の点で非常に洗練されていて覚えておく価値アリなものになってます。 Expose 該当部分だけを目立たせることが出来る ↓↓クリックするとクリックした位置以外がグレー表示になります Tooltip イカしたスタイルがかかったツールチップ Tab 綺麗なタブUI Overlay LightBox風のページ内ウィンドウ実装 Scrollable 少ないスペースでコンテンツをスクロールするウィジェット実
Ajaxで実現するエフェクト20選「20 More Excellent AJAX Effects You Should Know」
最近ではライブラリも多数リリースされ、様々な所で使われている「Ajax」簡単に高度なエフェクトや動作が導入可能ですが、今日紹介する「20 More Excellent AJAX Effects You Should Know」はAjaxで実現するエフェクトをまとめたエントリーです。 GlassBox 様々なAjaxのサンプルが紹介されていますが、今日はその中からいくつか気になった物を紹介したいと思います。 詳しくは以下 ■LightWindow YouTubeに動画、画像、PDFファイルと様々なメディアに対応したライトボックスエフェクト。 ■Unobtrusive Table Actions テーブルの各ブロックにエフェクトを付与できるAjax。データを見せるページには便利に使えそうです。 ■iCarousel plugin イメージをスライダー形式で表現できるAjax。 ■Validat
Ajax開発等に超便利なページ内の変更部分が一発で分かるFirefoxアドオン「Firediff」:phpspot開発日誌
Ajax開発等に超便利なページ内の変更部分が一発で分かるFirefoxアドオン「Firediff」 2009年04月20日- Firediff - In Case of Stairs Ajax開発等に超便利なページ内の変更部分が一発で分かるFirefoxアドオン「Firediff」。 これは欲しかった！という機能がついにリリースされました。 インストールにはFirebug1.4が必要で、Firebug1.4a17以降が推奨されています。 Firebug1.4のダウンロードはこちらから可能です。 まず、インストールすると、次のように、FirebugにChangesタブが表示されます。 で、実際どうやって使えるか？見てみましょう。 (1) DOMインスペクタをいじった結果をDIFF たとえば、DOMインスペクタの中で、要素を編集してみます。 2009年4月16日を2009年にしてみました。 す
Ajaxload - Ajax loading gif generator
Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
[JS]jQueryのプラグイン33+1選 -2009年1月
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 Ajaxify さまざまなAJAXコンテンツを実装。 Agile Carousel パネルをダイナミックにスライド。 Start/S
ナビゲーション実装に使える、Ajaxライブラリ/サンプル集:phpspot開発日誌
35 Easy to use Free Ajax/Javascript Navigation Solutions : Speckyboy - Web Design, Web Development and Graphic Design Resources 35 Easy to use Free Ajax/Javascript Navigation Solutions ナビゲーション実装に使える、Ajaxライブラリ/サンプル集。 便利そうなナビゲーションパーツが多数紹介されていて参考になります。 Outlook Navigation Bar jQuery suckerFish Tree with Checkbox Nodes Tabbed Search Bar Sliding Tabs Floating window with tabs 続きを見る クールで分かりやすいサイト作りに役立てまし
HTML/JavaScriptをインクルード表示させる方法 | エンタープライズ | マイコミジャーナル
WebページでHTMLやJavaScriptを表示させる場合に厄介な問題がある。実際のソースコード、たとえばそれはHTMLやJavaScriptだったりするわけだが、実際に使われるそういったコード保守する必要があるほか、そのコードを表示させているHTMLの方に含まれているコードも保守する必要があるということだ。 大量のチュートリアルを作成している場合などは特に面倒なことになる。デモコードを書き換えるごとに、それを表示させているHTMLの方に含まれているコードも変更しなければならない。編集を忘れてしまえば実際に動作しているコードと表示されるコードが違うという事態にもなる。 同じことを考えるプログラマは多いようだ。Christian Heilmann氏は1月29日(米国時間)、Displaying source code with Ajaxのタイトルのもと、外部のファイルをインクルードして表示
ポインタを合わせるだけでボックス内を水平に動くようにするCSSとMootoolsのあわせ技
ちょっとしたサイトのアクセサリーとして使えそうな感じです。 サンプルはこちら 灰色のボックス内のはじっこにマウスを持っていくと、ボックス内だけがスクロールし始めます。 詳細は以下で。 コードは結構簡単 以下のようにmootools.svn.jsを読み込みます。 <script type="text/javascript" src="mootools.svn.js"></script> 以下も、bodyタグの前に挿入<script type="text/javascript"> window.addEvent('domready', function(){ var scroll = new Scroller('container', {area: 100, velocity: 1}); $('container').addEvent('mouseover', scroll.start.bin
AjaxMail：Ajaxを活用したフリーPHPメールフォーム
ウェブサイトを動的なページに変更したい、機能を拡張したいと思ったら、 Ajaxのツールを使って簡単に機能を拡張してみよう。 ウェブサイトを運営するとき、サイトを見たユーザーからコメントを残してもらうことがあります。 また、企業なら連絡方法としてメールの送信ができるように、メールフォームを用意していると思います。 こうしたウェブサイトのメールフォームをAjaxを使って導入することができます。
ユーザーが2～3カラムや800pxか1000pxか等を動的に変更できるすごいJavaScript*ホームページを作る人のネタ帳
これは面白すごい。 なかなかさわり心地の良い動き。 しかも無料でダウンロードまでできるし、使えるし、なんともありがたい一品に、思わず勢いで記事にしてしまいました。 まずは以下のサンプルを触ってみると感動しますよ！（たぶん） サンプルデモは以下に 動的なhtmlショーケース 対応しているブラウザの幅も広いです。 # nternet Explorer 6, 7 # Firefox 1.5 + # Opera 9.1 + # Netscape 8.1 + # Safari 3 変更できる内容として # 右、左のサイドメニューの有り無し # 横幅800px、1000px、100% # フォントサイズ 等が変更できます。 もしもダウンロードするなら、以下のサイトに説明（英語）とダウンロードボタンがありますので是非。 Liquid Javascript Grid Layout
iTunesのカバーフロー風ＵＩをJavaScriptで実現「ProtoFlow」:phpspot開発日誌
ProtoFlow first preview release… :: Deensoft I got busy with few other client work and didn’t really get any chance to polish up the ProtoFlow widget. iTunesのカバーフロー風ＵＩをJavaScriptで実現「ProtoFlow」。 まずはデモページを見てみましょう HTMLは次のようにシンプル <div id="protoflow"> <img src="imgs/DSCN0940_91360.jpg"/> <img src="imgs/stimme_von_oben_187192.jpg"/> <img src="imgs/Tropfen_1_Kopie_201721.jpg"/> <img src="imgs/farbraum_01
jQueryでweb制作をする時にキープしておきたい30リストまとめ*ホームページを作る人のネタ帳
jQuery公式サイト まずはｊQueryJavaScriptライブラリの入手。 jQueryの簡単な説明 Re：zapa氏 今更ですが、jQueryにはまりました ドキュメントとリファレンス 公式ドキュメントサイト（英語） jQuery 1.2 ドキュメント日本語訳 jQuery リファレンス 色々とデモがついているのでわかりやすい。 jQuery入門 (ver 1.2.1) jQueryの入門サイト。 こちらもサンプルデモが多く有り、わかりやすいです。 jQuery 開発者向けメモ - 基本・サンプル サンプルがたくさん有ります。すこし高度。 中級編 jQueryのパフォーマンス最適化に関するTips 軽量jQueryをもっと高パフォーマンスにする為のヒント。 [JS]jQuery 1.2リリース&変更点など jQueryを1.2以前から使っているユーザー向けのエントリ。 HTML/J
クリック後の説明文を凄くオシャレに表示できる「mooSlide」:phpspot開発日誌
mooSlide - ajax based slider - lightbox replacement The mooSlideBox v3 is a small and slim ajax based extension or replacement of the common "lightbox" that can be found on nearly every page. This lightbox clone works in IE 6/7, Opera and Firefox. クリック後の説明文を凄くオシャレに表示できる「mooSlide」。 LightBoxの一種になると思うのですが、表示の仕方がかなりオシャレなmooSlide。 クリックしたところ、ページ下部からブロックがアニメーションして説明が表示されます。 仕組みはLightBoxでも、みせ方次第でこれだけ印象って変
JavaScriptライブラリの先駆け「prototype」を勉強しなおすサイト20
twitter facebook hatena google pocket 現在JavaScriptライブラリは数多くリリースされていますが、それらのさきがけとなったのは「prototype」でした。 またNASAのサイトでも使用されているように、その実力は広く認められています。 今回はprototypeの価値を見直し、勉強できるサイトを紹介します。 sponsors Reference ・prototype.js リファレンス（v1.4.0,1.5.x,1.6.0） ・prototype.js の開発者向けメモ：（v1.5.0） ・prototype.jsリファレンス HowTo / Review ・第１回：Prototypeライブラリの内部 ・いまからはじめるPrototype.js ・第１回：Prototype.jsを使う準備 ・Prototype.jsとは何か ・Prototype
[JS]パネルをフェードや加減スクロールで切り替えるスクリプト -wSide
wSideは、パネルの切り替えにフェードや加減スクロールなど多彩なアクションを実装するスクリプトです。 wSide, plugin jquery wSideはjQueryのプラグインで、動作にはjquery.jsが必要です。 切り替え時の多彩なアクションは、デモページを参照ください。 シンプル デモ 縦方向・横方向への加減スクロール、フェード エフェクト付き デモ 反動付きスクロール、縦横斜めのスクロール アドバンス デモ CSSを利用して、さまざまな効果を狙ったパネルの切り替え
JavaScriptライブラリ「jQuery」関連サイト34 : skuare.net
twitter facebook hatena google pocket 米大統領選でクリントン氏と壮絶な攻防を繰り広げるオバマ氏のサイトでも使用されるなど、巷で大人気のjQuery。 今回はjQueryの関連サイトを紹介します。 追記： 2008/2/8 2サイト 2008/5/29 2サイト 2008/6/25 1サイト 2008/7/9 5サイト（jQuery UI系・Cheet Sheetを集めました） sponsors Reference ・jQuery リファレンス：v1.0.x、1.2.x ・jQuery 1.2 ドキュメント日本語訳 ・jQuery 開発者向けメモ：v1.1.x ・jQuery日本語リファレンス：v1.2.6 HowTo / Review ・jquery.jsを読み解く（追記：2008/2/8） ・jQueryの魔法 ・ニュータイプなJSライブラリjQue
[JS]jQueryのプラグイン33+1選 -2008年1月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 jqzoom 画像の一部をズーム。 Shadowbox 複数のJavaScriptライブラリに対応したLightbox。 Faceb
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Ajaxベースのクールなショッピングカート作成:phpspot開発日誌
Prototype.js 1.6.0 用チートシート:phpspot開発日誌