[JS]パネルをグリッドに沿ってドラッグ&ドロップで移動し、レイアウトを自由に構築できるスクリプト -Gridster
CSS3アニメーションのかっこいいエフェクトを伴って、パネルをグリッドに沿ってドラッグ&ドロップで移動し、レイアウトを自由に構築できるjQueryのプラグインを紹介します。 パネルはグリッドに沿って、カラムをまたいでも移動できます。移動した際に他のパネルは指定した縦列・横列数とマージンを維持します。 他のパネルも移動可能です。 対応ブラウザ Internet Explorer 9+ Firefox Chrome Safari Opera Gridsterの使い方 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script type="text/javascript" src="libs/jquery.js"></script> <script type="text/javascript" src="jquery.gridster.js"></scri
[JS]表示サイズにあわせて最適なレイアウトを提供する高性能なスライドショーのスクリプト -Camera
表示サイズに合わせて、スライドショー自体のサイズやサムネイルなどを最適な状態で提供するスライドショーを実装するjQueryのプラグインを紹介します。 もうすぐ始まるIEの自動アップデートのIE8にも対応しています。 Camera | a free jQuery slideshow by Pixedelic [ad#ad-2] Cameraのデモ Cameraの使い方 Cameraのデモ デモは上記のトップにあるものと、他に3種類のスライドショーがあります。 トップのものが一番シンプルで、Cameraの基本性能を楽しめます。 画像の切り替えには、美しいアニメーションが採用されています。 デモ：Fullscreen フルスクリーンタイプのスライドショー。 Cameraの使い方 Cameraで使用する基本的なHTMLの構造から。 HTML div要素にHTML5の独自属性で「data-src」を
表示サイズに合わせてフォントのサイズやレイアウトを最適化できるjQueryプラグイン・jFL - かちびと.net
ちょっと気になってたjQueryプラグイン だったのでテストしてみました。表示 しているサイズに応じてレイアウトや フォントサイズを最適なものにしてく れる、というもの。Media Queryは使用 していないのでcssも綺麗に保てます。 場合によっては軽量化に繋がるかも、と思ったのでちょっとテストしてみたかったライブラリ。説明されてもあんまりピンとこないライブラリですけどｗなんというか、かゆいところに手が届く的なやつです。 このようにサイズを表示変えるとフォントサイズやdivの幅も指示通り変わってくれます。Media Query択一だと、どうしても面倒になってくることもあるので、こういうスクリプトも覚えておくと保険になるかもですね。スクリプトはたったの6KBですので軽量化にも役に立つかもしれません。 尚、IE6と7には対応していません。 日本語でも問題ありませんでした。以下サンプルどうぞ
[JS]インタラクティブでフレキシブルなレイアウトが楽しめるスクリプト -Magic jQuery
ページ内のエレメントの配置や、メニュー、タブなど、ユーザーインタラクションを伴ったレイアウトが簡単に実現できるjQueryのプラグインを紹介します。 Magic jQuery デモ [ad#ad-2] 配置のデモでは、ピンクのパネル（「drag me」）をドラッグすると、それに合わせて各パネルの配置がダイナミックに変更されます。 ピンクのパネルを移動したキャプチャ 上記の各色のパネルにはそれぞれ条件が設定されています。 例えば、オレンジのパネルは下記のようなスクリプトになっています。 JavaScript $("#orange").align({top:'', bottom:"", left:"", rightIsLeftOf:'pink'}); $("#orange").limit({rightIsLeftOf:'blue'}); オレンジのパネルはピンクの左に沿って配置（align:r
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
