Zooming

JavaScript

クールな画像ズーム機能を実装できる「Zooming」

Zoomingはクールでかっこいい画像ズーム機能を実装することができるJavaScriptライブラリです。jQueryなどを必要とせず純粋なJavaScriptでつくられているほか、モバイルも念頭に置き構築されているのが特徴です。

Zooming

デモ

デモでは画像にマウスオーバーするとカーソルが虫眼鏡のアイコンに変化します。その状態で画像をクリックすると画像がズーム(拡大)します。その後、再度クリックすると元の状態に戻ります。

クイックな動作で画像をズームできるので、ストレスなく拡大した画像を見れるのがいいですね。シンプルで直感的な操作により、快適な画像ズーム機能を実装することが可能です。

また、デモページでは画面下の方に、FASTER、SLOW DOWN、MAKE IT DARK、NO GRABというボタンが設置されています。

各ボタンをクリックするとボタンに色がつき、それに対応したセッティングが有効になります。ズーム時の速さや背景の変化など、いくつかのセッティングが用意されているので、気になる人はこちらもぜひ試してみてください。

というわけで、シンプルなズーム動作がかっこいいクールなズーム機能を実装できる「Zooming」のご紹介でした。

Zooming

Grasp Mobile Progress Circleアニメーションつきのプログレスサークルを実装できる「Grasp Mobile Progress Circle」前のページ

ドラッグ&ドロップでテーブルを並べ替えられる「table-dragger」次のページtable-dragger

関連記事

  1. Animate Transition
  2. no-image

    JavaScript

    円形に広がるメニュー実装「expanding action button」

    expanding action buttonは円形に広がるメニューを…

  3. no-image

    JavaScript

    プレーンなJavaScriptによるレスポンシブなLightbox「jsOnlyLightbox」

    jsOnlyLightboxは、jQueryなどを必要としないプレーン…

  4. Quttons

    JavaScript

    ボタンの形状やカラーが変化するjQueryプラグイン「Quttons」

    Quttonsはボタンをクリックすると形状やカラーが変化して新しいコン…

  5. Animate Plus

    JavaScript

    CSS、SVGを使った多彩なアニメーションを実装できる「Animate Plus」

    Animate PlusはCSS、SVGを使った多彩なアニメーションを…

  6. Wipe Slider

    JavaScript

    背景画像を滑らかにスライドさせるjQueryプラグイン「Wipe Slider」

    Wipe Sliderは背景画像を滑らかにスライドさせることができるj…

最近の記事

  1. そそそ 明太クリームそうめん
  2. すしざんまい
  3. 蒼龍唐玉堂 特製牛バラ担々麺
  4. サーモンアボカドサラダラップとドリップ
  5. 猿田彦フレンチ

アーカイブ

PAGE TOP