でろぐのロゴ 豚さんブーブー

レスポンシブ対応で使えるんじゃないかと思うJQueryプラグインの私的まとめ。

2012年10月3日 (水)

久々にWebネタで。
最近なにかとレスポンシブが騒がれてるんですがそれは僕の回りでも結構あるので今後のためにも使えそうなものをリストアップしてるのでついでにまとめようかなと。
基本的にはHTMLとCSSで完結させたいと思っている僕ですが、UIの事を考えるとjsで制御しないといけない部分も多いよねという事で。

フレームワーク
jQuery Mobile
http://jquerymobile.com/
有名なので説明いらんとおもう。

JQtouch
http://www.jqtouch.com/
こっちも結構いいんじゃないかなとおもう。

フレームワーク系で実装するのはレスポンシブだとめんどくさいなと個人的には思うので振り分けの時にでも使えるかもという感じ。

アコーディオン
Beautiful jQuery Vertical Sliding Accordion
http://www.htmldrive.net/items/show/937/Beautiful-jQuery-Vertical-Sliding-Accordion-
画像の見せ方で必要な場合に。

カルーセル・スライダー系
jq.carousel
http://5509.github.com/jq.carousel/
縦があまり長くならないようにする時にはカルーセルという場合も選択しかなと。細かい指定ができるのがいいと思う。

BXSLIDER
http://bxslider.com/
1枚の画像を切り替えて使う場合。シンプル。

jCarousel
http://d.hatena.ne.jp/kudakurage/20100810/1281403944
国産シンプル版。導入がめちゃ楽。

Lightbox系
ColorBox
http://www.jacklmoore.com/colorbox
iPhoneでも位置調整をしてくれるので使えるかも。でもわざわざスマートフォンでLightboxを使う必要があるのかという点については微妙やと思う。

jquery.lightbox_me.js
http://buckwilson.me/lightboxme/
Lightboxでフォームを作りたいときに。需要はあまりないと思うけど一応。

イメージギャラリー
PhotoSwipe
http://www.photoswipe.com/
画像ギャラリーを作る時用。どっちかというとスマートフォンがメインぽいのでPC版の見せ方を考えるのが難しい気がする。

AWESOME MOBILE IMAGE GALLERY WEB APP
http://tympanus.net/codrops/2010/05/27/awesome-mobile-image-gallery-web-app/
こっちも同じくスマートフォンがメインぽい感じ。画像ギャラリーは見せ方とか色々考えるのが大変ですね。

遊び心忘れない事もいるよね系
jQuery Masonry
http://masonry.desandro.com/
要素の整列用。スマートフォンで使用するシーンが思い浮かばないのはきっと自分の想像力が貧困なんだと思うw

HoverAttribute jQuery plugin
http://www.afekenholm.se/hoverattribute-jquery-plugin
リンクテキストの処理用。PCだとオンマウスでぐにょーんって動く。iPhoneだとリンクをタップしたときにリンクテキストの変更を制御できる感じ。
あんまり必要ないかもしれんけど…。遊びたいときに。

gridster.js
http://gridster.net/
要素を自分で動かせるのが面白い。実用性はほぼないと思うけどw

といった感じかなと。あくまで個人的な感想なので使うときは自分で考えてくださいね。

シェアする