7月ももう終わりますね！
毎日暑い暑い…いっていたら、夏もあっという間に終わりそうです。
最近天気の良い日は、時間を見つけて5キロくらいランニングをしていますが、仕事柄デスクワークで汗をかかないので（クーラーの中で涼しく仕事をしている）、汗かいたときすごく気持ちよくて幸せです。
あと、ドラムの練習してるときも汗かくのでいいですね！（最近休日はスタジオ三昧。）
余談はこれくらいにして、今回はCSS3でフェードで画像が切り替わるフルスクリーンスライドショーを実装してみました。
ちなみに今回の効果はCSS animationsをサポートしているブラウザでないと動作しませんのでご注意ください。
公式というか、本家は以下のサイトです。
【URL】CSS3 Fullscreen Slideshowの配布サイト
Javascriptではなくcss3で動いているのに、ほんとスムーズです。
動きがとってもきれい。
codepenで実装してみました。
See the Pen CSS FULL SLIDE by sayuri (@giraffeweb) on CodePen.0
文字の位置などは各々で調整してください。
基本的にはcssを丸々コピーしていただければそのまま使用できます。
@keyframesを使用して書いているので、@keyframesを知らない人は調べてみて下さい。
そういえば@keyframesの説明をこのブログでかいたことなかったですね！
来週@keyframesのお話をしようと思います！（今更かもですが！笑）