新年あけましておめでとうございます!2017年

2017年
新年あけましておめでとうございます!
本年もよろしくお願い申し上げます!

今年はフリーになって4年目、法人化してからは3年目になり、
いろんな事に慣れてきた頃なので、ここらで初心を思い出して、
停滞するのではなく、ガンガンせめていこうかと思います!!

何卒、何卒よろしくお願いいたします!

CSSでふわふわと回転演出

CSSでふわふわと回転演出を実装してみた。

.fuwafuwa_img {
	-webkit-animation-name:fuwafuwa;
	-webkit-animation-duration:2s;
	-webkit-animation-iteration-count:infinite;
	/*-webkit-animation-direction:alternate;*/
	-webkit-animation-timing-function:ease;
	
	-moz-animation-name:fuwafuwa;
	-moz-animation-duration:2s;
	-moz-animation-iteration-count:infinite;
	/*-moz-animation-direction:alternate;*/
	-moz-animation-timing-function:ease;
}
.guruguru_img {
	-webkit-animation-name:guruguru;
	-webkit-animation-duration:40s;
	-webkit-animation-iteration-count:infinite;
	/*-webkit-animation-direction:alternate;*/
	-webkit-animation-timing-function:ease;
	
	-webkit-animation-name:guruguru;
	-webkit-animation-duration:20s;
	-moz-animation-iteration-count:infinite;
	/*-moz-animation-direction:alternate;*/
	-moz-animation-timing-function:ease;
}
/* ふわふわアニメーション */
@-webkit-keyframes fuwafuwa {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, -10px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes fuwafuwa {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, -10px);}
	100% {-moz-transform:translate(0, 0);}
}
/* 回転アニメーション */
@-webkit-keyframes guruguru {
	0% {-webkit-transform:rotate(0deg);}
	100% {-webkit-transform:rotate(360deg);}
}
@-moz-keyframes guruguru {
	0% {-moz-transform:rotate(0deg);}
	100% {-moz-transform:rotate(360deg);}
}

参考サイト
https://www.softel.co.jp/blogs/tech/archives/4080