自分の経験をシェアしたい。Webデザインのテクニック&効率化。
投稿日：
アニメーションは、CSSの方がスピードも速くていいのですが、面倒なのがCSSの指定方法です。
そんな場合に簡単に、CSSアニメーションを作れるのが、「WAIT! Animate」です。
作例では、待機時間と14種類の動きを指定でき、その場でプレビューできます。
コピペできるので、ペーストするだけで動く簡単さです。
カスタムでは、アニメーションの時間や角度など細かく指定できます。
アイコンは、Webフォントを使うと簡単に動きます。
待機時間が指定できるので、ちょっとしたアクセントに便利ですね！
執筆者：KIYOTA
関連記事
フラットデザイン向けのシンプルで美しいCSS3グラデーションジェネレーター
「Blend—Generate Simple and Beautiful CSS3 Gradients」は、 フラットデザインにあう色が限定に、 グラデーション用のCSSジェネレーターです。 Blen …
【CSS/JS】もっと目立たせて欲しいと言われた場合のTipsまとめ
キャンペーンサイトなど、動きをつけて、もっと目立たせて欲しいなどの要望を受けることは多いのではないでしょうか。言われて探すのは結構手間がかかったりします。見栄えする動きを中心にまとめました。 Phot …
iPhoneのoverflowをスムーズにスクロールさせるCSS
iPhoneでoverflow: scroll;の時に、 -webkit-overflow-scrolling: touch; を追加すれば、滑らかに慣性スクロールできます。 overflow: sc …
PDFなど、CSSのみで拡張子によって自動でアイコンを表示する
WordやExcelなどをサイトにアップして、アイコンをつけることは多いと思います。 <a href=”word.pdf” class=”iconWord&# …
最近は、SASSを使えば、フォントサイズをpxからem/%に変換するのは簡単です。 しかし、以前作ったサイトを更新する際に、フォントサイズの一覧がない場合は、pxからem、%に計算するのが面倒です。 …
2022/08/15
Webデザイナーが残業代をもらっていたら、いくらになったのか？
2022/06/12
2022/02/06
2018/10/11
Webデザイナーで、転職がうまくいかない場合のひとつの方法として
2018/08/18