画像や要素をステッカーをめくるように動かす -sticker.js-

ステッカーをめるくような動きを画像や要素に追加できるJavaScriptの紹介です。
<div>を使ってbackground-imageやbackground-colorを指定し、動かしています。

ホバーする際の方向によってめくれる向きも変わります。
ギャラリーのサムネイルなどに使うのも面白いですね!
今回使用したのは、Sticker.jsです。

↓以下が実際のソースサンプルです。

▼JavaScript



▼CSS


▼HTML

今回、参考にさせていただいたのは、
『Sticker.js』
『cmiscm/stickerjs · GitHub』です。
ありがとうございます。

デモページは、こちら