エントリーの編集
![loading...](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/common/loading@2x.gif)
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイルシート・「transition.css」
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
![アプリのスクリーンショット](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/entry/app-screenshot.png)
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイルシート・「transition.css」
transition.cssは独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイル... transition.cssは独自属性で任意のHTML要素に様々なアニメーション遷移エフェクトを付与できるスタイルシートです。 CDNも用意されていますが、配布サイトで数値を調整してコードをコピーする事も出来るので1つのプロジェクトで複数のエフェクトを使わないのであればCSSそのものを読み込む必要はありません。 遷移のスタイルは円型、ワイプ、四角型、ポリゴンなどに分けられており、各種にいくつか異なるエフェクトが用意されています。 以下、動作サンプルです。 右下にあるrerunを押せば動作を確認できます。 サンプルではポリゴンのin:diamond:hesitateを利用してみました。以下のコードが提供されます。 @keyframes diamond-in-hesitate { 0% { clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50