ババーン
タイプNOアニメーション系
類似の音ドーンバーンババーン
目次
オノマトペ
オンマウスしてみよう
ソースコード例
あくまでも一例なので参考程度に使ってください。
ババーンHTML1
<div class="sample"> <img src="/wp-content/themes/onmtp/imgs/baba-nn.png" width="" height="" alt=""> </div>
ババーンHTML2
.sample { margin: 0 auto 60px; border:1px solid #CCC; width:150px; height:150px; overflow:hidden; position:relative; } .sample img { padding:10px; width:130px; height:auto; transform-origin: 60% 20%; } .sample:hover img { transform:scale(2); }
使い方
- 写真にオンマウスしたら「ババーン」って大きくできないかな?
- なんとなくサムネイルと比べてアップの写真って「ババーン」ってしてるよね