サイト内検索:

CSSデザインの最近のブログ記事

イメージ操作で使える10個のjQueryプラグインとテクニック

 

10 jQuery Plugins and Techniques for Doing More with Images」という英語の記事がありました。

そんなわけで知っているのもあれば知らなかったものもあるでしょうけど、10サイトなんでぱぱっとチェックしてみましょう。

まずはこちら。

1.Photo Zoom Out Effect

普通はサムネールがあってマウスオーバーで拡大、というパターンだと思うのですが、逆に縮小します。「えっ、なんで縮小させるの?」と思った人はデモを見てみてください。デザインからのアプローチだとこういうのもありなんですね。

2.jCrop

画像を矩形指定して切り抜くことができるようになります。デモだけ見ると矩形指定だけなのでLive Crop Demoを見るといいかもしれません。

3.Zoomer Gallery

よくあるサムネールがその場でちょっと拡大、みたいなやつですが、キャプションがアニメーション表示されるのがちょっとだけおもしろかったりします。

4.jQuery Captify Plugin

画像にマウスオーバーで画像の下の方に半透明のレイヤーでキャプションが表示される、という類のやつです。

5.Animate Panning Slideshow with jQuery

スライドショーなんですが、慣性スクロール系で右に左に、そして右斜め下などにスクロールしつつ写真を表示させたりします。これはなかなかおもしろいですけど、なんかちょっと重い感じがします。

6.Sponsor Flip Wall With jQuery & CSS

これは面白いですね。よくスポーツ大会があったときに試合終了後に選手がインタビューを受けますが、その時の背景にスポンサーのロゴが配置されたボードが置かれますが、そんな感じのデザインのやつで、各ロゴをクリックするとくるっと回ってキャプションが表示されます。こういう動きで神経衰弱が作れることでしょうw

7.jSquares

サムネール画像にマウスオーバーで単に画像を拡大表示するだけじゃなく説明文入りのDIV要素などを表示させることができるようになるみたいです。でも、このデモはいまいちです。

8.ZURB JavaScript Annotation Plugin

画像内の任意の場所ににアノテーション(注釈)を入れられるようにします。とりあえずアノテーションを表す黒い丸画像がホクロみたいに見えて集中できません(あ、ホクロ以外のデザインもありました)。

9.Zoomooz

画像を拡大するわけですが、拡大の仕方が強引でおもしろいと思います。「Flickr Image Stack」というデモがわかりやすいと思います。とりあえずFlickr検索しないと何も写真が表示されないのでキーワードに「sexy」とか入れてみてください。で、sexyと入れるとむふふな写真が表示されるんだろうなあ、わくわく、と期待しつつ、大きく裏切られてみてください。まったく男ってやつぁ・・・。

10.iViewer

デモはこちらで見れるようです。
Google Mapsみたいな感じ、でいいのかな。

その他、リンク先のページには関連記事として、

10 jQuery Plugins to Help with Web Page Layouts
14 Fresh and Useful jQuery Plugins
14 Helpful Cheat Sheets for Front-end Web Development
12 Useful jQuery Plugins for Working with Tables
12 Excellent jQuery Plugins for Enhancing Forms

なんて記事がありました。

COTOBACO


連絡とか感想とか何でも↓にコメント書いてくださいね。

COTOBACOに投稿(読む)

このアーカイブについて

このページには、過去に書かれたブログ記事のうちCSSデザインカテゴリに属しているものが含まれています。

前のカテゴリはBlogPeopleです。

次のカテゴリは音楽です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

新着DVD

BlogPeople PEOPLE

【Atom Netbook/MID】

【ガジェット!ガジェット!ガジェット!】

【あなたのライフハック大募集! 】

トラックバック・ピープル

[BlogPeopleピープル]

[iTMSピープル]

お誕生日おめでとう

Yahooで取り上げられた記事

ブログ内検索

BlogPeople ReviewMe!

このサイトのレビューとか応援コメントを書いてもらえると励みになります。

Affi☆List for Amazon

昨日のアクセストップ5

ブログリンク