kyo191のブックマーク / 2012年8月29日

kyo191 id:kyo191

2012年8月29日のブックマーク (2件)

[JS]サムネイルにマウスオーバーしたら画像を切り替える
大きい画像１箇所とサムネイルいくつか配置して、サムネイルにマウスオーバーしたら大きい画像をサムネイルのやつに変更するスクリプト。テーブル版、複数設置版、クロスフェード版の他、jQuery版とMooTools版も書きました。シンプル版イベントリスナーを使用したもの thumbsというIDにあるimgタグを自動収集して、srcから_thumbを抜いたものを viewに入ってるimgのsrcへ置換します。テーブル版イベントリスナーを使用したものカスタマイズする場合はforの変数iが1から始まっている事に注意。これは取得したimgの配列から先頭にあるimg#rollover_viewを飛ばすためです。逆配置にする場合は、0スタートで(myImg.length-1)とする。ページ内に複数設置する場合大きい画像とリストのIDをクラスに変更。親のIDを指定して実行します。複数設置＋
kyo191 2012/08/29
jquery

スライドショー

サムネイル
リンク
[JS]直感的な操作性がたのしい、画像ギャラリーのスクリプト -Fotorama
デスクトップだけでなく、iPhoneをはじめとするスマートフォンなど、さまざまなデバイスに対応した画像ギャラリーを実装するjQueryのプラグインを紹介します。 Fotorama [ad#ad-2] Fotoramaの主な特徴 Fotoramaのデモ Fotoramaの実装 Fotoramaの主な特徴 Fotoramaはセットアップも簡単で、直感的な操作性が楽しい画像ギャラリーのスクリプトです。メインの画像をスライドするにはいくつかの方法が用意されています。矢印ボタンでメイン画像をスライドドラッグ操作でメイン画像をスライドナビゲーションでメイン画像をスライドサムネイルでメイン画像をスライドサムネイルもドラッグでスライドすることができます。サムネイルもドラッグでスライドサムネイルのボーダーはアニメーションで動作し、読み込み時のエフェクトも用意されています。 Fotoramaの
kyo191 2012/08/29
jQuery

ギャラリー

スライド

JS
リンク
- 2012年8月30日
- 2012年8月29日
- 2012年8月23日