http://neteye.github.com/activity-indicator.html
NETEYE Activity Indicator A jQuery plugin that renders a translucent activity indicator (spinner) using SVG or VML. Features Lightweight script No images required No external CSS Resolution independent Alpha transparency Highly configurable appearance Works in all major browsers Uses feature detection Degrades gracefully Supported Browsers The plugin has been successfully tested in the following b
prototype.jsからjQueryに移行するたったひとつの冴えたやりかた - os0x.blog
どうもこんにちは、os0xです。 実は(Twitterに書いただけで)ブログに書いてなかったのですが、3ヶ月ほど前からクックパッドで働いています*1。なんかもう今更ですよね、すみません。 さてさて、クックパッドですが、つい一昨日までprototype.jsを使っていました。で、昨日jQueryへの移行をリリースしたところだったりします。 というわけで、その辺の話を少し書いてみたいと思います。 そもそも、なんでjQueryに移行するのか まあ、prototype.jsとjQueryどちらを使うかと問われたら、大抵の人はjQueryと答えますよね。確かにjQueryの使いやすさは魅力的です。使いやすいということは、みんなでjQueryを使ってサービスを作ることができます。特定の誰かに依存してボトルネックになったりすることがないなら、それは素晴らしいですね。 しかし、ライブラリを変えるのは簡単な
[JS]jQueryのプラグイン33+1選 -2009年8月
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 slideView 動きが面白い画像のスライドショー。 Mop Slider コンテンツのスライダー。バージョンアップ。 simpl
[JS]滑らかにスライドするナビゲーションを実装するチュートリアル
滑らかにスライドするアニメーションが軽快なナビゲーションを実装するチュートリアルをSoh Tanakaから紹介します。 Animated Navigation with CSS & jQuery demo デモでは背景の有無の2パターンで、どちらも滑らかにスライドするアニメーションが面白い効果を生み出しています。 ナビゲーションはリスト要素で実装されており、「overflow:hidden;」でマスクし、マウスのホバーでスライド表示させています。 <textarea name="code" class="html" cols="60" rows="5"> <ul id="topnav"> <li><a href="#">Home</a></li> <li><a href="#">Services</a></li> <li><a href="#">Portfolio</a></li> <li
QuickFlip jQuery Plugin | Jon Raasch's Blog
QuickFlip takes any piece of HTML markup and flips it like a card. It’s simple to implement and the animation is fresh and original. How QuickFlip works Normally QuickFlip uses two panels: a front and a back. When a flip occurs, the front panel is split in half with Javascript. The right and left halves slide into one another, and afterwards the opposite occurs with the back panel. While it’s not
一日で学ぶ jQuery(ラボブログ)
スパイスラボ神部です。 OpenSocial アプリの開発を効率化するために、jOpenSocial か opensocial-jquery のどちらかを使いたいのですが、そのためにはまず jQuery について学ばないと行けないようなので、jQuery についてざっと調べてみました。 -AJAXが好きだ！ - Favorites! Write less, Do more -jQuery: The Write Less, Do More, JavaScript Library まずは公式。 リファレンス -jQuery 1.3.2 日本語リファレンス 参考になりそうなリソース いろんな記事を見ると、とりあえずは jQuery を使うと、構造化された状態でリッチアプリケーションが組めるという部分が強調されている記事が多いような気がします。「jQuery + AJAX で RIA な UI
ASCII.jp：Googleマップ＋jQueryで作るAjaxなデザイン｜29分でできる！ あのサイトの“技”を盗め
今やさまざまなWebサイトで使われ、すっかり地図の定番となったGoogleマップ。 コーポレートサイトや飲食店のサイトなどで、純粋に案内図としてページに埋め込むのが一般的ですが、中にはもっとおもしろい使い方で、ユーザーを楽しませているサイトもあります。 一例として、「hitotoki」というWebマガジンを紹介しましょう。hitotokiは、ある特定の場所に関するショートストーリーを地図と絡めて紹介するWebマガジンです。Googleマップをまるで独自に描いた絵地図のようにうまくサイトになじませ、「地理と文学を結びつけた町の文学地図」というコンセプトに合わせて効果的に活用しています。 今回は、このhitotokiのGoogleマップ活用法をお手本としましょう。 今回のお手本サイト： 『hitotoki―町の文学地図』 「場所」にまつわる読者の思い出を募り、地図と写真とともに紹介する投稿型の
jQuery入門（その1）（1/7）：CodeZine
はじめに 実を言うと、私はずっとJavaScriptを嫌っていました。JavaScriptのコードを書くのが嫌でしたし、いろいろなブラウザに対応するために大量のスクリプトコードを使わなければならないのも嫌でした。そうした点は今でも変わらないのですが、最近になってJavaScriptへの理解が深まったことと、jQueryという小さなJavaScriptクライアントライブラリのおかげで、クライアント中心のAJAXスクリプトコードを書かなければならないときでも恐怖を抱かなくなりました。それどころか、今では喜んで引き受けるほどになっています。クライアントロジックがもっと複雑になり、ブラウザの機能や実装の多様化がさらに進んだとしても、jQueryをはじめとするクライアントライブラリが、JavaScriptやHTML DOMを扱う際に必要な正規化を提供してくれます。 私はJavaScriptの初心者と
jQueryを使ったFlashばりにクールなギャラリー「GalleryView」:phpspot開発日誌
jQuery GalleryView - by Jack Anderson jQueryを使ったFlashばりにクールなギャラリー「GalleryView」が公開されています。 初期化に以下の数行を書けばＯＫみたい。 $('#photos').galleryView({ panel_width: 800, panel_height: 300, frame_width: 100, frame_height: 100 }); 動かしているHTMLのなかなか分かりやすいです。 関連エントリ 訪問者驚きの手めくり風、画像ギャラリー作成サンプル 滑らかに画像が切り替わる超絶クールFlash写真ギャラリー「imagin」 色々な画像の見せ方を演出できる画像ギャラリー集
[JS]パネルをスムーズなアニメーションで開閉するシンプルなスクリプト
Simple Toggle with CSS & jQuery demo デモではバーをクリックすると、パネルがスムーズに開閉します。 それぞれのパネルは個別に開閉するため、同時に開いた状態にすることも可能です。 バーはH2要素、パネルはdiv要素で実装されており、パネル内には画像やテキストなどを自由に配置することができます。 HTMLの基本構造 <textarea name="code" class="html" cols="60" rows="5"> <h2 class="trigger"><a href="#">Toggle Header</a></h2> <div class="toggle_container"> <div class="block"> <h3>Content Header</h3> <!--Content--> </div> </div> </textarea>
トレーニングAjax入門2 jQueryでフォントサイズを変更する : 4GALAXYのメモ
29 06 09 2007 トレーニングAjax入門2 jQueryでフォントサイズを変更する jQuery, Ajax よくある動的に文字サイズを変更するコードをJavascript JQueryで書いてみました。 昨日の記事jQueryでcookieを超簡単に扱える事がわかったので、 早速、汎用性の高そうなコードを書いてみました。 コード <script type="text/javascript" src="jquery.js"></script> <script language="javascript" src="jquery.cookie.js"></script> <script type="text/javascript"> <!-- $(function(){ $("p").css("font-size",$.cookie('fsize'));
FlashではなくjQueryで！インパクトのあるUIを作ろう (4/5)
最後はスクリプトの組み込み HTMLタグが準備できたら、スクリプトを組み込むだけです。2ページ目で説明したように、今回はWeb上にあるライブラリに直接リンクしています。Query UIのタブを使うには以下の2行を書き加えましょう。 <script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.core.js"></script> <script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.tabs.js"></script> そして、もう1つ。デフォルトのスタイルシートファイルもWeb上にあるものを直接読み込ませます。 <link rel="stylesheet" href="h
JavaScriptで飛び出すWebページへ！
「解像度が低く画面領域が狭いPCでも見やすくページを表示させたい」「すっきりとしたレイアウトに見せたい」――そうした、Webページのコンテンツの表示／非表示を切り替えたいことがある。そんなときには、やはりJavaScriptを使うのが便利。上下・左右にコンテンツを折りたためるようにするJavaScriptライブラリはいくつもあるが、今回はちょっと変わった楽しい演出で表示を切り替えてくれるライブラリを紹介しよう。それが「jQuery pageSlide」だ。 jQuery pageSlideは、jQueryのプラグインとして動作するオープンソース（MITライセンス）のJavaScriptライブラリ。このpageSlideをWebページに組み込むと、特定のリンクをクリックするだけで右側から別のコンテンツがスルッとスライドで飛び出してくるようになる。そのまま左側の領域をクリックすると、今度は左か
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
IDEA * IDEA
[JS]ホバー時に浮かぶエフェクトがとってもリアルなスクリプト
[JS]jQueryのプラグイン33+1選 -2009年4月 | コリス
IDEA * IDEA
skuare.net - JavaScript / Movable Type / etc.
http://www.designwalker.com/2009/01/slide.html
