Mediumライクな画像ズームを実装できる「MediumLightbox」

MediumLightbox

シンプルでエレガントな画像ズーム機能をwebサイトに実装できる「MediumLightbox」をご紹介します。Mediumライクな美しいズーム機能を取り入れたい方は必見です。必要最小限のアニメーションで、長文記事との相性はバツグンだと思います。

MediumLightbox

デモ

文章内に埋め込まれた画像をクリックすると、アニメーションとともに画像がズーミングします。オーバーレイつきなので、文章が非表示になり画像に集中できるのがいいですね。拡大された画像を再度クリックすると、元の状態にもどります。

「さっと拡大してさっともどせる」。このシンプルな動作が、可読性を損なわずに長文を読み進められるポイントになるのではないでしょうか。

使い方もカンタンで、手軽に実装できるのがうれしいですね。

imgタグ内には、data-width、data-heightといった属性を指定できます。また、オプションではmarginを設定することも可能です。marginのデフォルト値は20になります。

MediumLightbox

スポンサーリンク

スポンサーリンク

アクセスランキング

Tags

オススメ商品

Archives