CSSahaムービー 花に囲まれた洋館

HTML/CSSコーディング

CSSでつくるahaムービーその2。前回よりさらに難易度低し。

出題編

以下の画像のどこかが30秒かけて徐々に変化します。さてどこが変わってるでしょうか。IE9以下非対応です、モダンブラウザでご覧ください。

30秒で変化しきってそのあと30秒で逆再生…を無限ループしてますのでじっくり何度も見てればわかるかも。

答えは以下の通り。黒枠にマウスのっけると解答が表示されます。

解答編

前回のが思いのほか気づきにくかった?みたいなのでものっすごくわかりやすいとこ変化させてみました…がさすがにこれは目立ちすぎですね。

ちなみにこれはCSSのキーフレームアニメーション使って作ってます。

問題の画像加工も丁寧にやんないと面白みも半減なのでその辺も頑張んなくちゃ。

んじゃまた。

コメント

タイトルとURLをコピーしました