1. まとめトップ
  2. IT・ガジェット
115 お気に入り 182153 view
お気に入り追加

画像にカーソルを乗せると写真がぺらっとめくれたり、折り畳まれたり。簡単に動きをつけられます。

メインビジュアルの画像を左から右に無限ループで流してます。ほかにも、パラパラ漫画の要領でスプライト画像のキャラが動いたり。

メニューからサムネイルがスッと出現します。画像にカーソルを乗せると証明があたったような感じになるのがクール。

親カテゴリーの画像リストをクリックすると、そのカテゴリーに登録された画像一覧が、画面遷移なしでその場で画面にリスト表示されます。状況によっては結構使えそう。

ボタンやスクロールバーで画像を切り替えると、写真がペラッと宙にめくれる感じがなんとも素敵。大サイズの画像にはあまり適さないし、使いどころがなんとも分からないですが、気持ちいいです。

サークル状の画像にカーソルを乗せると、その場所によって画像がめくれる位置が変わります。

ブロックをクリックすると、そのブロックの情報が画面いっぱいに広がって表示されます。このページのようなプラグインまとめとかでこういう見せ方できると、閲覧者は全体が一目で分かって見やすそう。クリックして詳細を表示できるし。

複数のギャラリーブロックが配置されていて、マウスを乗せると乗せたブロックの写真が切り替わります。クリックをすると各ブロック一斉に切り替え。マウスを使わずに自動で時間差切り替えもアリですね。

見た目も動きもごくごくありきたりなんですが、ページャーにカーソルを乗せたときのサムネイルの切り替わり方がなんか素敵。

カーソルを乗せるとクルッと画像が回ります。しかも、外側の淵を少し残すのがいい感じです。スタッフ紹介ページとかで使えそう。

サンプルが映画の画像ということもあってか、TSUTAYAでDVDを手にとり、裏面の解説を読むアクションを彷彿させます。めくれた時の側面が白っぽいので、背景色との兼ね合いがありそうです。

本やソフトを紹介する際に是非使ってみたいエフェクトです。

ごくごくシンプルなものですが、これ系のホバーエフェクトってこれから作る機会多そうなのでエントリー。オリジナルのライブラリー作るのに参考になります。

徐々にズームさせたり、テキストを動かしたり。ただのフルスクリーンな背景画像じゃなく、こういう見せ方もありですね。

ページャーが直線なので、デザインの一つとして使えそうです。例えば時系列を表現する際に使ったり。コンテンツを区切るためのHR的な使い方をしたり。

1 2





ウェブ・デザイン・企画・演出・ビジネス・お金などの情報をキュレートしてます。



  • 話題の動画をまとめよう