jfMagnify

JavaScript

プラス・マイナスボタンつき!コンテンツの細部をチェックできる拡大鏡を実装する「jfMagnify」

jfMagnifyはHTMLコンテンツの細部を拡大して表示させる拡大鏡を実装することができるjQueryプラグインです。画像などの細部をチェックしたいときに便利ですね。拡大鏡にはプラス(+)とマイナス(-)ボタンがついており、倍率を変更することが可能です。「もっとズームしたい!」「もうちょっと引いて見たい!」というときに役立つ機能です。

jfMagnify

デモ

デモでは1枚の画像の上に虫眼鏡のような拡大鏡が設置されています。拡大鏡はドラッグして好きな位置へ移動させることができます。

特定の部分を拡大させてじっくりチェックしたいときに便利ですね。

また、拡大鏡にくっついている+・-ボタンをクリックすると拡大率を調整することができます。自分の見やすい大きさに設定できるので、ユーザーにとってはありがたい機能になるのではないでしょうか。

ちなみにデモの画像の上にはテキストリンクも設置されていますが、このテキストリンクも拡大して見ることができます。

画像のみならずテキストなども拡大できるので、いろんなケースに応用できそうですね。

jfMagnify

関連記事

  1. Force.js

    JavaScript

    要素を手軽にアニメーション化できる「Force.js」

    Force.jsはページ上の要素を手軽にアニメーション化させることがで…

  2. Stretchy

    JavaScript

    入力した文字数に合わせて可変するフォーム実装「Stretchy」

    Stretchyは入力した文字数に合わせてボックスが伸び縮みするフォー…

  3. scrollUp

    JavaScript

    スクロールしていくと先頭に戻るボタンを表示してくれるjQueryプラグイン「scrollUp」

    下へスクロールしていくと、先頭に戻るボタンを表示してくれるjQuery…

  4. PhotoSwipe

    JavaScript

    タッチジェスチャーにも対応したイメージギャラリー・PhotoSwipe

    PhotoSwipeはスマホやタブレットのタッチジェスチャーにも対応し…

  5. Zebra_Tooltips

    JavaScript

    シンプルでスマートなツールチップを実装できる「Zebra_Tooltips」

    Zebra_Tooltipsは軽量でシンプルなツールチップを実装できる…

  6. Multipicker

    JavaScript

    要素を選択するときに直感的な操作を実現する「Multipicker」

    Multipickerは、日付や曜日、番号、その他さまざまな要素を選択…

最近の記事

  1. スタンスミス(EDIFICE/IENA別注)
  2. WI-1000XM2
  3. mill オイルヒーター
  4. Anker PowerWave 10 Pad & Stand セット

アーカイブ

PAGE TOP