Categoryズーム

カーソルを乗せると画像が拡大するjQueryプラグイン「ZooMove」

ZooMove

ZooMoveは、マウスオーバーで画像を拡大させてみせることができるjQueryプラグインです。

画像を一部を詳細に見せたいときなどに効果的。この動きは、ネットショップの商品紹介の画像でもよく使われる機能ですね。

こちらのjQueryプラグイン「ZooMove」を利用すると、拡大させる動きも滑らかで、ストレスなく見せることができます。

動きはサンプルをこちらのご覧いただくとわかりやすいと思います。

カーソルを乗せると画像が拡大するjQueryプラグイン「ZooMove」サンプル


ググってみましたが、まだjQueryプラグイン「ZooMove」は日本語では紹介されていませんでした。

でも、使いやすいのでこれから日本でも使われる機会が増えそうな気がします。

→「カーソルを乗せると画像が拡大するjQueryプラグイン「ZooMove」」の続きを読む

モーダルをフルスクリーンで表示させるjQueryプラグイン「animatedModal.js」

モーダルウィンドウというと、クリックするとポップアップで小窓が開いてそこにコンテンツが表示されるというイメージがありますが、このjQueryプラグイン「animatedModal.js」を使うと、小窓ではなくフルスクリーンでモーダルウィンドウが表示されます。

動きもにゅるっと、気持ちいい動きになっています。

フルスクリーンで表示されるので、モーダルで表示させたいコンテンツが多い時などに重宝しそうです。

サンプルを作ってみました。

⇒ モーダルをフルスクリーンで表示させるjQueryプラグイン「animatedModal.js」サンプル


動きは、サンプルを見ていただけるとわかると思います。

→「モーダルをフルスクリーンで表示させるjQueryプラグイン「animatedModal.js」」の続きを読む

虫眼鏡のように画像の一部を拡大ズームするjQueryプラグイン「Zoomy Jquery Plugin」


Zoomy Jquery Plugin

今回紹介するのは、画像の一部分を虫眼鏡を通したようにズームさせるjQueryプラグイン「Zoomy Jquery Plugin」です。

ネットショップの商品紹介の画像でも使われたりする機能ですね。商品の細かい部分まで伝えることができるようになります。演出的にも面白い機能です。

サンプルを作ってみました。こちらをどうぞ。

→ jQueryプラグイン「Zoomy Jquery Plugin」サンプル


設置の仕方も簡単で、処理も軽くスムーズです。

使い方は続きをご覧ください。

→「虫眼鏡のように画像の一部を拡大ズームするjQueryプラグイン「Zoomy Jquery Plugin」」の続きを読む

好きな要素をにゅるっとズーム(拡大)させるjQueryプラグイン「Zoomooz.js」

Zoomooz.js

Zoomooz.jsは、Webページの要素のズームを行うためのjQueryプラグインです。

画像をズームさせてギャラリー風に見せたり、テキストを一部拡大させて効果的にみせたりすることに使用することができます。しかも設置方法は簡単です。

サンプルはこちらからどうぞ

→ 好きな要素をにゅるっとズーム(拡大)させるjQueryプラグイン「Zoomooz.js」サンプル


うまく組み合わせて使えば、アイデア次第ではWEBサイトだけでなく、Preziのようにプレゼンにも使うことも出来そうです。

「Zoomooz.js」の設置方法は続きをご覧ください。

→「好きな要素をにゅるっとズーム(拡大)させるjQueryプラグイン「Zoomooz.js」」の続きを読む