2021年03月31日(水)
任意のCSSアイコンから別のCSSアイコンへの遷移アニメーションのコードを提供する・「CSS ICON animate」
CSS ICON animate
CSS ICON animateは任意のアイコンから別のアイコンへの遷移アニメーションを、アイコンも含めて全てCSSで作れるサービスです。以前ご紹介した、CSSのみで出来たアイコン集のCSS ICONが、各CSSアイコンからCSSアイコンへのアニメーションコードを提供するようになったみたいです。
任意のCSSアイコンを2つ選択するだけで、選んだ順にアニメーションしながら遷移するコードを発行してくれます。
example
↑ アイコンをクリックすると別のアイコンに変化します。両アイコンともCSSで作られています。
楽で良いんですが、デフォルトで用意されているのがクリックイベントで遷移するJSコードがjQueryだったりCSS ICONのCDNを@importしてたりなのでこの辺は必要に応じて便宜変更してください...
0
3
4
12
author:
かちびと.net
WordPressやJQueryなどを中心に、Web開発者のためのチュートリアルやコードスニペットの記事を公開しているTakahashi Yoheiさんのブログ
‹ PREV
グラデーションを美しくするには配色が重要、真ん中辺りがグレーにくすんでしまうのを避ける方法
NEXT ›
リアルZ世代のトレンドを調べるZ総研トレンド通信～Z総研トレンド通信Vol.9『Instagram後編』～
Ads
WordPressやJQueryなどを中心に、Web開発者のためのチュートリアルやコードスニペットの記事を公開しているTakahashi Yoheiさんのブログかちびと.netの記事『任意のCSSアイコンから別のCSSアイコンへの遷移アニメーションのコードを提供する・「CSS ICON animate」』についてまとめています。
この記事は特にアニメーション・jQuery・アイコン・SVG・Webサービスについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のかちびと.netで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとかちびと.netの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
