jQueryでブラウザウィンドウのリサイズに合わせてのdivとかもリサイズ(縦のみ) - DO☆KA☆TA ~information technology~
ブラウザウィンドウの縦のリサイズに合わせて表示中のdivとかで括られた部分を 同時にリサイズし、縮め過ぎたらスクロールバーを出す。ということをしなくては いけなくなった。 普通に組み込みと、長ったらしくてぱっと見、複雑そうで萎えるjavascriptのコード なりそうだったので、jQueryでできないかと思った。 しかし、自分で考えるのがいやだったので、色々飛び回った。そしてあった。 海外のどっかのサイトでサンプルがあったのだが、 場所を失念したのでサンプルに似たようなコードをメモしとく。 下記のコードでは、コンテナ（divタグ）でリサイズに応じて伸び縮みする対象を ３つ想定している。 ※divタグで、id=aaとid=bbとid=ccがあることを想定 ※footmargin変数は、フッターの余白の高さである。 $(document).ready(function() { var foot
jQueryでGoogle Mapsを簡単に扱えるようになるプラグイン『Google Maps jQuery Plugin』 - IDEA*IDEA 〜 百式管理人のライフハックブログ
ドットインストール代表のライフハックブログ
画像が浮き上がるjQueryを使ったイメージギャラリー:phpspot開発日誌
jQuery Image Effects - Hover Effect w/ jQuery & CSS - jQuery Tutorial 画像が浮き上がるjQueryを使ったイメージギャラリー。 デモページのようなギャラリーを作成できます。 jQueryで小気味よくアニメーションするところがなかなかよいです。 ちょっとしたところで使えそうですね。 関連エントリ jQueryを使ったFlashばりにクールなギャラリー「GalleryView」 訪問者驚きの手めくり風、画像ギャラリー作成サンプル 滑らかに画像が切り替わる超絶クールFlash写真ギャラリー「imagin」
lightbox
prettyPhoto prettyPhoto is a jQuery lightbox clone. Not only does it support images, it also support for videos, flash, YouTube, iframes and ajax. It’s a full blown media lightbox. It is very easy to setup, yet very flexible if you want to customize it a bit. Plus the script is compatible in every major browser, even IE6. It also comes with useful APIs so prettyPhoto can be launched from nearly an
ホバー時にブロックの背景色を滑らかにアニメーションするJSサンプル:phpspot開発日誌
Using jQuery for Background Image Animations - Snook.ca ホバー時にブロックの背景色を滑らかにアニメーションするJSサンプル。 デモページ デモページを見ればわかりますが、カーソルをあわせると滑らかに背景がアニメーションされます。 アニメーションの仕方がなかなか良くて、左→右や、上→下のように方向を指定できます。 当然ですが、Flashを使わなくてもJSでこうしたことが出来て、今までありそうでしたが、そんなに多く見かけることがなかったテクニックではないでしょうか。 覚えておくとふとしたときに使えそうです。
パネルをめくるような効果でブロック要素を切り替えられる「Flip!」:phpspot開発日誌
Flip! A jQuery plugin パネルをめくるような効果でブロック要素を切り替えられる「Flip!」。 次のようなパネルを上下左右の自由な方向にクルっと回転させられるウィジェット実装用jQueryプラグインが公開されました。 サイト上の省スペースで、製品なんかをＰＲする際に使えそうですね。 サイズを大きくすればプレゼンにも使えるかも。
フィールド間を自動でタブ移動してくれる入力補助JSライブラリ「Autotab」:phpspot開発日誌
Autotab: jQuery auto-tabbing and filter plugin | Matthew Miller フィールド間を自動でタブ移動してくれる入力補助JSライブラリ「Autotab」。 電話番号入力欄や、郵便番号入力欄で、フィールドが複数に分かれている場合、桁数が決まっているのであれば、次のフィールドに自動で移ってくれた方が使い勝手はよくなります。 Tabで移動することは出来ますが、その処理を知らない場合はマウスで移動する人なんかもいそうですし、打つキー数も多くなります。 そこで、オンラインバンキングなどではよくある、規定の桁を入力した後は次のフィールドに自動で移ってくれるＪＳライブラリがjQueryベースで開発され、公開されています。 実装は簡単で、まず必要なＪＳを読み込みます。 <script type="text/javascript" src="jquery
画像をスムーズに拡大できるjQuery版FancyZoom:phpspot開発日誌
FancyZoom meet jQuery // Ordered List // We Make The Web Beautifully Simple 画像をスムーズに拡大できるjQuery版FancyZoom。 サムネイル画像をクリックするとそこからズームされる感じにアニメーションされるFancyZoomのjQuery版が出たみたい デモ jQueryな方にはよさそうですね。アニメーションがなめらかで、動作も軽いみたいです。 関連エントリ 画像を同一Window内でスムーズにズームしてくれるJSライブラリ色々
【ハウツー】わずか数行で"ものすごいテーブル"に! - jQueryプラグイン「Flexigrid」 (1) ドラッグ&ドロップでカラム幅を変更可能 | エンタープライズ | マイコミジャーナル
Webアプリケーションの操作性を向上させるために、いまや欠かすことのできないJavaScript。Prototype.jsやjQueryといった各種フレームワークを使用して、ユーザビリティを高めている開発者も少なくないだろう。 ここ数年の間でYahoo! UI LibraryやExt JS、Dojo Toolkitといった、開発のしやすさや・操作性の向上はもちろんのこと、綺麗なデザインも兼ね備えているライブラリが増えてきた。既存のWebアプリケーションに少しのコードを追加するだけで、機能もデザインも付加できるこれらのライブラリは非常に魅力的だ。 ここではテーブルで組んだリストに対して、まるで表計算ソフトのような操作性を提供するFlexigridライブラリを紹介したい。 ネイティブアプリケーション並みのリストを実現 FlexigridとはPaulo P. Marinas氏が開発・公開している
これはかっこいいぞ・・・スライドショーに激しく使えるjQuery用プラグイン『jQuery Cycle Plugin』 | i d e a * i d e a
ドットインストール代表のライフハックブログ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
IDEA * IDEA