<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">

<!-- キュンキュンボタン -->
<div id="QnnQnnbutton"  >
<img id="kyunimg" src="data:image/jpeg;base64,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"/>
<P>今のキュンキュン数</P>
</div>
/*キュンキュン動きを定義*/
#QnnQnnbutton:active {
-webkit-animation: bounce 1s ease-in-out;
animation: bounce 1s ease-in-out;
}
@-webkit-keyframes bounce {
5% { -webkit-transform: scale(1.1, .8); }
10% { -webkit-transform: scale(.8, 1.1) translateY(-5px); }
15% { -webkit-transform: scale(1, 1); }
}
@keyframes bounce {
5% { transform: scale(1.1, .8); }
10% { transform: scale(.8, 1.1) translateY(-5px); }
15% { transform: scale(1, 1); }
}
/*キュンキュンボタンの画像*/
            #kyunimg {
                position: absolute;
                zoom: 1;
                /*中央に来るように*/
                top: 50%;
                left: 50%;
                -webkit-transform : translateY(-50%);
                transform : translate(-50%,-50%);
            }

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.