Boost up » Blog Archive » CSSアニメーションで、keyframesをjsから扱うい・ろ・は・すのみかん風味のやつ、『温州(うんしゅう)みかんエキス入り』だけど『無果汁』って、いったいみかんのどんなエキスが入ってるんだよ？ 前回作ったコンテンツスライダーのアニメーションは、縮小アニメーション→回転アニメーション→拡大アニメーションという3つの動作を、transitionendイベントを利用してjavascriptで繋げていたのですが、CSSアニメーションにはキーフレームアニメーションという方法もありまして、こちらを利用すれば先の動作を以下のように一連の動作をCSSのみで設定することができます。 #hoge:hover { animation:anime-name 2s linear; } @keyframes anime-name { 10% { "transform:scale(0.75) rotateY(0deg); } 90% { "transform:scal
CSS keyframes の Javascript による動的な書き換え - jsdo.it - Share JavaScript, HTML5 and CSS
