注目のAjax情報のポータル

AJAXとCSSで作るクリエイティブなフォーム集「Astounding Ajax/CSS Forms: 30+ Modern Trends」ユーザーとコンタクトが取れる窓口的な役割を持つフォーム。ユーザーが実際に使う部分だけに、そのデザインやわかりやすさ使い勝手によって、目的が達成できるかどうか大...

いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる...

並列に配置されたナビゲーションの現在位置を明示したハイライトをアニメーションで移動させるスクリプトをCSS-Trickから紹介します。jQuery MagicLine Navigation デモページ現在位置を明示するサインは、ライン（キャプチャ：上）と背景（同：下）の2種類が用意されています。 ...

フォームの入力時に、入力欄に配置されたラベルが枠外にアニメーションで移動するスクリプトをCSSKarmaから紹介します。Form Design with Sliding Labelsデモページスライドするアニメ [...]

Flashのように美しいフェードで画像を次々に表示するスライドショーのスクリプトをlab111から紹介します。blackbox demoそれぞれの画像は、下記のようにリスト要素で実装されています。HTMLスクリプトの設置は簡単で、スクリプトを外部ファイルとして指定し、表示時間やサイズを指定します。...

Feedbackボタンをクリックするとサイド からフォームのパネルをスライドさせる jQueryプラグイン・contactableをご紹介 致します。情報元は去年の記事ですが、 自分が使いたかったのでメモ的にエントリ。 ユーザーにも優しいのでお勧めです。 わざわざページ移動せずともパッと送信出来る...

グリッドベースのレイアウトをブラウザのサイズに合わせて、レイアウトを自動で変更するスクリプトを実装するチュートリアルをCreativityDenから紹介します。

「Some Useful JavaScript & jQuery Snippets」なるエントリーがありましたよ。Part 1とPart 2がありますが、どちらも使える感じかな。ちょっとメモ的にエントリーっす。興味のない方はスルーの方向で・・・。個人的に使いそうなものをいくつか紹介してみますかね。...

jQuery Form Tips Plugin フォーム要素にうっすらデフォルト値を入れてヒント表示できる「jQuery Form Tips」 フォームにデフォルト値を入れておくことで利用者が何をいれていいのか、というのが直感的にわかり、かつスペースもとらないのでよく使われる手法ですが、実装も超簡...

『 jQueryでツールチップを表示させるプラグイン 』

サイトのデザインに合うlightbox系スクリプトを探している。そんなときにおすすめなのが、『The Best jQuery Lightbox Scripts』。クールなjQueryのlightbox系スクリプト集です。知らないのもあったりでいい感じのものが揃っていますよ。CeeBox アニメーシ...

フォームのinputやtextarea要素にキーボード機能をつけたい。そんなときにおすすめなのが、『jQuery Keypad』。ソフトウェアキーボードを実装するjQueryプラグインです。↑の例は、inputにフォーカスすると、キーボードが現れるタイプです。キーボードには、「閉じる」「クリア」「...

軽量なjavascriptライブラリjQuery、かなり高機能で、様々な表現ができますが、今回紹介するのはjQueryを利用して、ページの真横からスライドで表示されるサブページを実現する「jQuery pageSlide」です。上記のようにメインコンテンツエリアを、ヨコにスライドして、サブページが...

Appleのサイトのような、かっこいいインターフェースを実装したい。そんなあなたにおすすめなのが、『15 Incredible Apple Webdesign Style Coding Tutorials』。Appleのようなデザインをするためのコーディングチュートリアル集です。かなりかっこいいの...

またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」2009年12月16日-またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」。 Ext.js ばりにきれいなUIと多機能さで今後が期待されるJSフレームワークです...

2009年に紹介したものを中心としたjQueryのプラグイン100選です。カルーセル・ニュースティッカー関連ギャラリー・画像拡大関連ナビゲーション関連タブ関連パネル・ボックス関連角丸関連ツールチップ関 [...]

個人的に必要になるかもと思ってメモ。 テキストや画像にエフェクトを与えて Webサイトを動きのあるサイトにする 手助けをしてくれるjQueryのプラグイン をいくつかご紹介します。コンテンツに対するユーザーの興味を高めたり、画像を使用せずテキストを装飾したりと、使い方次第でいろいろ用途がありそうで...

近年、Google Chrome、Firefox、Safari、Opera、Internet Explorer（以下、IE）がJavaScriptの実行速度の最速の座を争っていますが、それに伴いJavaScriptによるフレームワークやコンポーネントが多数出現し、Webブラウザのユーザビリティは飛...

ちょっとメモ。いつか使う（ことを検討する）。どこかで紹介したっけかな・・・まぁ、いいか。非商用だと無料で使えるグラフ描画ライブラリですね。オプションが豊富すぎてかなりいろいろできそう。↑ こんなのがちょちょいと。↑ ある範囲をズームさせる機能なんてのもあります。↑ オプションのレファレンスが使いや...

少ないスペース内でコンテンツをグリグリスクロールさせられるjQueryプラグイン「Flips」が公開されています。 小さな枠を３分割させてページをスライドさせるなど動きとしてもおもしろいコンテンツスクローラーになっています。 少ないスペースに色々なコンテンツを置くような場合に参考にできそうです。 ...

select ボックスを超便利にしてくれユーザビリティ向上に使える「jQselectable」がGoogle Codeに公開されています。 jQというだけあって当然ながらjQueryプラグインの形式です。 適用前の普通のSelect ボックスが便利に変化します 都道府県の縦に長かったものが横方向に...

IE共通の9つのCSSバグをそれぞれ解決する方法がNettutsにて紹介されています。 どれも、なんでだろうと頭を悩ましそうな問題なので解決法を知っておくと簡単に対処できそうです。 1. センタリングが効かない問題 margin: auto を指定した場合の期待する結果 IEの場合以下のようになり...

既存の検索ボックスを簡単にSafari風のデザインに変更するスクリプトを紹介します。jQuery Safari Searcherdemo検索ボックスのスタイルは通常用とインクリメンタルサーチ用が用意されており、 [...]

『 Apple風のスライドショーギャラリーのチュートリアル。xhtml,css,jqueryで実現! 』

デザインも秀逸ながら、ユーザビリティに配慮して大量の項目を掲載するドロップダウン型のナビゲーションを実装するチュートリアルをSoh Tanakaから紹介します。Mega Drop Down Menus w/ CSS & jQuery demoユーザビリティで配慮したポイントは、ホバー時にドロップダ...

ExtraTutsというサイトで、デベロッパーなら知っておきたいCSSテクニックが紹介されています。いくつかご紹介しますね。CSS Browser Selector OS・ブラウザごとにCSSを切り替えられる1行のJavaScriptadding a CSS StyleSheet to your ...

jqueryのプラグインのまとめです。jqueryはjavascriptベースのライブラリのようなもの。画像やメニューに動的な操作を与えたりすることが可能です。また、HTMLソースも複雑になりにくく、デザインをCSSで操作可能なものが多く、ウェブデザインをより魅力的にすることができます。フェードし...

ナビゲーションなどによく使用されるCSSスプライトにアニメーション効果を加えて簡単にセットアップできるスクリプトをNew Media Campaignsから紹介します。AutoSprites – A jQuery Menu Plugin demoデモでは、リスト要素で実装されたナビゲーションに一枚...

ドラッグ＆ドロップで数値の設定が出来る便利ＵＩを実装できる「jquery-drag-spinbox」2009年10月30日-ドラッグ＆ドロップで数値の設定が出来る便利ＵＩを実装できる「jquery-drag-spinbox」。 普通、数値入力というと、ボックスに直接入力したり、ボタンを連打したりし...

二枚の画像を少しずつフェードでブレンドして切り替える画像ギャラリーのスクリプトをblog.olicio.usから紹介します。Floom demoデモはまるでフラッシュのように、進捗のバーが表示され、画像を切り替えると共にテキストも変更し、次々と画像を表示します。オプションでは、アニメーションのスピ...