紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 前回のjQueryのプラグイン33+1選 -2007年9月と合わせて、参考ください。 lightbox for jQuery jQu
[JS]jQueryのプラグイン33+1選 -2007年11月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 前回のjQueryのプラグイン33+1選 -2007年9月と合わせて、参考ください。 lightbox for jQuery jQu
[JS]ホバー時に光源が移動するエフェクトがかっこいいスクリプト
マウスのホバー時に、光源がカーソルに追従するエフェクトがかっこいいスクリプトをcoders.meから紹介します。
jQueryでAjaxを利用する基本チュートリアル (1/4)
前回の「フォーム」に続き、jQueryの特別な機能を解説します。今回取り上げるのは、「Ajax」を利用するための機能です。 今さら聞けない「Ajax」とは？ 「Ajax」（エイジャックス）は 「Asynchronous JavaScript + XML」の略で、あえて日本語にすれば「JavaScriptとXMLによる非同期通信処理」といった意味です。難しく聞こえますが、JavaScriptでWebページを切り替えずにサーバーとデータをやりとりすることです。JavaScriptでサーバーのデータを取りに行けば、ページを切り替えずに画面の一部を書き換える、といった処理ができるようになります。 WebブラウザーはWebページを表示するために、サーバーからHTML/XHTML（以下、特に断りのない場合はHTMLと書きます）ファイルを取得し、取得したHTMLを解釈して描画（レンダリング）します。通常
HTML5でサイトを高速化─wri.peで学ぶ、イマドキのWebアプリの作りかた（後編）
HTML5でサイトを高速化─wri.peで学ぶ、イマドキのWebアプリの作りかた（後編） 増井 雄一郎（FrogApps, Inc.） 前回の記事では、 wri.peの紹介と、HTML5のApplication Cacheを使ったHTMLや画像などの読み込み高速化の話をしました。今回は、Web StorageのlocalStorage/sessionStorageを使い、Ajax通信部分と表示の高速化を行う手法を説明しましょう。 localStorageを用いた通信と表示の高速化 前回のApplication Cacheで、HTMLの読み込みが高速化されました。これでも十分速くはなったのですが、画面に全ての情報が表示されるまでには、ちょっと時間がかかります。 wri.peではメモの一覧や、メモ本体の読み込み・保存はXHR(XMLHttpRequestの略。Ajax通信で使うモジュール名)を
[JS]デザイナーのためのjQueryのチュートリアル
Web Design Wallのエントリー「jQuery Tutorials for Designers」から、JavaScriptのライブラリ「jQuery」が視覚的にどのように動作するかデモと共に解説してる10のチュートリアルを紹介します。
Google Feed APIで3分マッシュアップ (1/2)
特定のテーマに関する情報を集めた、ポータル的なWebサイトを作りたい――。そんなとき、JavaScriptを使って、他のWebサイトのフィードから情報を得て、そのサイトの最新情報を表示できると便利です。 しかし、普通の方法ではできません。というのも、JavaScriptでフィードを読み込むのに使う「XMLHttpRequest」オブジェクトでは、セキュリティ上、異なるドメイン（クロスドメイン）とのやり取りが制限されているためです。そこで、「Google AJAX Feed API」を使いましょう。 Google AJAX Feed APIは、指定したフィードをGoogleのサーバー側で取得し、JSON（JavaScript Object Notation）と呼ばれるJavaScript専用のデータ形式に変換します。変換されたデータは、JSONP（JavaScript Object Nota
[JS]jQueryのプラグイン33 1選 -2008年3月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 Galleria 画像ギャラリー。 jQuery Multimedia Portfolio 画像・動画・音声のスライドショー。 Ea
jQueryで作るAmazon流リキッドレイアウト (1/5)
国内外を問わず、多くのECサイトがお手本とする「Amazon.co.jp」。この連載でも以前、Amazonが採用する「カルーセル」（回転表示するスライドパネル）の作り方を紹介しましたが（関連記事）、Amazonは優れたユーザーインターフェイス（UI）の宝庫でもあります。 中でも、過去の閲覧履歴などからページの大半が動的に生成されるAmazon.co.jpのトップページは、ユーザーを商品購入へと導くさまざまな仕掛けが組み込まれています。今回は、このAmazon.co.jpのトップページに注目します。 今回のお手本サイト：『Amazon.co.jp』 米アマゾン・ドットコムの日本法人アマゾンジャパンが2000年から運営するECサイト。書籍販売から始まり、現在ではペットボトル飲料水や紙おむつ、キッチン家電まで1000万点超の膨大な商品を扱っている。取扱商品の拡大に合わせて、2008年4月に大規模
Not Found |ミレスポ！ - Millennials Sports Marketing
横浜F・マリノスユース同期6人による新たな挑戦「ROOTS.」。新時代に適応するアスリートに必要な素質とは。
AJAXを使った素晴らしいCSSフォームの47のサンプル | コリス
noupeにエントリーされている、AJAXを使った素晴らしいCSSのフォームの47のサンプルの紹介です。
jQueryとは――Webデザイナーから見た魅力 (1/3)
Webデザイナーさん、（X）HTML／CSSコーダーさん、マークアップエンジニアさん、お待たせしました。Web制作者のためのjQuery入門が始まります。 本連載では、現役Webクリエイターの西畑一馬氏が、人気のJavaScriptライブラリ「jQuery」を使ったリッチなUI（ユーザーインターフェイス）の作り方を解説します。プログラムの基本的な書き方の説明から、実務で使えるサンプルの紹介まで。目指すは「Webデザイナーが最短距離でjQueryを使えるようになること」です。 jQueryをマスターすれば、たとえば「このタブパネルの向きを変えてほしいんだけど……」といったクライアントのわがままにもスピーディーに応えられるようになります。仕事の幅をぐっと広げるきっかけに、本連載をお役立てください。 （編集部） 圧倒的人気を誇るJavaScriptライブラリー「jQuery」 ここ数年、「pro
[JS]これ最強かものツールチップスクリプト -BeautyTips
シンプルなツールチップも簡単に実装できるだけなく、デザインのカスタマイズが可能で、対応トリガーも豊富なツールチップのスクリプト「BeautyTips」を紹介します。 BeautyTips demo BeautyTipsは機能が豊富というだけでなく、テキストや画像、AJAXコンテンツの表示、ツールチップの表示位置の自動補正など基本性能もしっかりと抑えられており、フォームエレメントへの表示、ツールチップ元の変更なども可能です。 ツールチップはcanvasで描かれており、画像は必要ありません。 対応ブラウザはIE6.x+, Fx3.x, Op8+, Safari3.xとのことで、canvas非対応ブラウザにはExplorerCanvasが使用されています。また、IE6のz-indexへの対応にbgiframe、ホバー処理にhoverIntentが使用されています。 ※Chrome 1, Fx2で
javascriptを理解するためのたった2つの大切なこと
9割ぐらいはハッシュ何がハッシュなのかjavascriptで存在するほとんどのオブジェクトの実体はハッシュだよ。 var arr = [0,1,2,3]; とかをみると配列(人によってはリスト)に見えると思う。でも実際は違うんだ。 これは var has = {0:0,1:1,2:2,3:3}; と基本的には等価なんだ。ただちょっと束縛されているメソッド(インターフェイス)が違うだけ。 ためしに arr[4] = 4; arr['x'] = 'string'; arr[-1] = -1; としてみよう。 Firebugで確認してみると[0, 1, 2, undefined, 4]というような値がかえってくるよ。 でもarr[-1]やarr['x']の値は保存されてないのかな？そんなことはないちゃんとアクセスできるんだ。 それどころかarr.xで'string'がかえってくるんだ。 別の例を
[JS]jQueryのプラグイン33+1選 -2008年9月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 MopSlider オート・マニュアルに対応したコンテンツスライダー。 MopBox スライド機能付きの移動可能なボックスを表示。
[JS]jQueryのプラグイン33 1選 -2008年10月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 ListNav リストの高機能なナビゲーションを作成。 Scroll your HTML ホイールにも対応した高機能なスクロールする
iPhoneがJavaScript＋SQLiteでGPSレコーダーに！ (1/5)
JavaScriptを使ってGPSデータを取得できるようになったiPhone OS 3.0。前回は、現在の位置情報を取得し、Googleマップに表示する方法を紹介しました。後編は、位置情報と日時をデータベースにどんどん記録していくプログラムを作ってみましょう。 Safariのデータベースを使う iPhoneに搭載されているSafariは、HTML5で追加される予定のAPI「Client-side database storage」を先行実装しており、ブラウザーが用意しているローカルデータベースにJavaScriptを使ってデータを保存できます。 iPhoneのSafariはデータベースエンジンとして「SQLite」を実装しています。SQLiteは、SQLのすべての命令には対応していませんが、簡単なWebアプリケーション用途であれば十分な機能を持つデータベースエンジンです。個々のテーブルは「
jQueryで作る“Amazon風”インターフェイス (1/5)
「最近、どこでよく買い物していますか？」――こう聞かれて「Amazon！」と答える方も少なくないかもしれません（特に本誌読者であれば）。当初は書店の店頭で入手が難しい書籍の購入などに重宝していたAmazonですが、取扱商品が増えた今では、ペットボトルの水からパソコンまで何でも買える便利なECサイトとして、ネット利用者の生活に定着しました。 もっとも、Webサイトを作る立場から見ると、Amazonの魅力は品揃えやサービスだけではありません。Webサイトのデザイン面からAmazonを見ても優れた点は多数あり、実際、国内外の非常に多くのECサイトがAmazonをお手本にしたUIを採用しています。今回は、「Amazon.co.jp」を参考にさせてもらいましょう。 今回のお手本サイト：『Amazon.co.jp』 米アマゾン・ドットコムの日本法人アマゾンジャパンが2000年から運営するECサイト。現
クライアントサイド JavaScript のパフォーマンス改善には backburner.js が便利！ - tricknotesのぼうけんのしょ
DOM 処理や Ajax など、JavaScript が外の世界とやり取りする部分というのは、一般的に待ち時間を多く必要とします。 パフォーマンスを改善しようと思った時に、ロジック部分でコツコツと節約するより、まずコストが高い処理を行わないようにするということで、驚くほどの効果を経験をされたことはありませんか？ 今までパフォーマンス測定をされた方であればピンとくる部分があることと思います。 そんな時に役に立つのが、今回ご紹介する backburner.js です。 ebryn/backburner.js - GitHub backburner.js って? backburner.js とは Ember.js の run loop モジュールから切りだされたとても小さなライブラリで、短時間に集中的に発生するメソッド呼び出しの回数を制限したい場合などに利用することができます。 backburn
古籏一浩のJavaScriptラボ
活躍の舞台をどんどん広げているJavaScript。本連載では、JavaScript関連書の執筆でおなじみの古籏一浩氏が、最新の活用Tipsから今後注目のAjax/JavaScriptライブラリーの解説まで、“楽しくできて役立つネタ”をお届けします。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[JS]jQueryのプラグイン33+1選 -2009年4月 | コリス