ITエンジニア/デザイナ向けにオープンソースを毎日紹介

ResponseはレスポンシブWebデザインを実現するのに必要な情報を取得できるJavaScriptライブラリです。

レスポンシブデザインを実現する際にスタイルシートだけで全てをこなすのは難しいかも知れません。ウィンドウの幅に応じて最適な見せ方を実現するためにJavaScriptの力が必要ならばResponseを使ってみましょう。


テストの画面です。ウィンドウや画面のサイズが出ています。


ウィンドウサイズを縮めると値がリアルタイムに変化します。


縦のスクロール値も出ます。


各種判定値が用意されています。


ウィンドウサイズによる簡易的な判定も可能です。


もちろんこのページ自体がレスポンシブです。

Responseを使えば現状のウィンドウサイズやスクロール位置などレスポンシブWebデザインを実現するのに必要な情報が一気に取得できます。さらにリサイズなどのコールバックにも対応しているので、表示したときだけではなく縦横に向きを変更したタイミングも感知可能です。

ResponseはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。


MOONGIFTはこう見る

CSS3になってスタイルシートの表現力が向上したこともあって、CSS3だけを使って色々なアクションやイラストを描いたりする試みがされています。それはそれでとても凄いことなのですが、実用的かと言われると疑問符がつきます。何でも一つの技術で行うのではなく、最適なものを選択するのが肝要でしょう。

技術要素としてはサーバサイド、HTML5、JavaScript、CSS3と多様にあります。レガシーな技術であればFlashもあります。利用者、開発者双方にとって最適な技術を選択できるかどうかが今後求められるようになるでしょう。大事なのはユーザ体験であり、そのための技術であるはずです(無理矢理やるのはそれはそれで面白いですが)。

Test Suite

ryanve/response.js

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2