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

スマートフォンが流行るのにともなって写真コンテンツが爆発的に増えています。そして次に求められるのは何かと言えば、写真のビューワーに他なりません。たくさんのコンテンツをいかに見せるかが大事になってきます。

今回はその一つ、Intense Imageを紹介します。写真をフルスクリーンで拡大してみせる、そんなビューワーになります。

Intense Imageの使い方

こちらがデモです。写真が3つ並んでいます。
こちらがデモです。写真が3つ並んでいます。

クリックするとブラウザウィンドウ全体に写真が広がります。
クリックするとブラウザウィンドウ全体に写真が広がります。

マウスを動かすと写真を動かせるようになっています。
マウスを動かすと写真を動かせるようになっています。

こちらの写真は上下に動かせます。
こちらの写真は上下に動かせます。

Intense Imagesは拡大表示するだけでなく、マウスで上下または左右に視点を動かせるのがポイントです。拡大した時には文字が表示されていますが、これは固定されています。拡大した写真はクリックで元の状態に戻ります。

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

Intense Images

tholman/intense-images

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2