こたらの日記

css3だけで作るペラッとめくれるボタン!

Cover Image for css3だけで作るペラッとめくれるボタン!


R1065799 / yoppy
ペラッとめくれるボタンを作りました。@kotala_bです。
作ったのは記事を下の方に置いてあるRSS登録やフォローのボタンです。

参考記事

こちらのページを参考にして作りました!
http://jsdo.it/IGARI/F8cICSS3のみで紙がペラッとめくれる表現 - jsdo.it - Share JavaScript, HTML5 and CSS
ありがとうございます!
こちらのページでは4種類のめくれるボタンが紹介されています。


追記
リンク切れしてしまったため参考サイトが見れなくなってしまいました。
追記終わり


そのうちの「ゆっくりめくれるボタン」を設置しました。

ソースコードをコピペ!

導入はコピペでコードを貼りつける!
このままだとテーマにもともと入っているcssと競合してうまく表示されない場合があります。
その時は、優先させたい方(コピペして貼りつけたコード)に!importantと加えることで表示させたいほうを優先出来ます。
http://www.htmq.com/csskihon/007.shtmlタイルの優先順位-CSSの基本
あとはchromeのデベロッパーツールを使って微調整をして実装しました。