bl6.jpホームニュースレビューお出かけアプリウェブサイトMacカメラレタッチTips雑記bl6.jpファッション、写真、旅行、ガジェットなどの備忘録menuホームJavaScriptアイコンをオシャレにアニメーションしながらtransformさせる「iconate.js」JavaScript2015.05.25アイコンをオシャレにアニメーションしながらtransformさせる「iconate.js」iconate.jsはアイコンをアニメーションさせながら別のアイコンへtransformすることができるJSライブラリです。使いどころは少し難しいかもしれませんが、ちょっとした可愛いアクセントにはピッタリですね。アニメーションの種類もそれなりに揃っている印象です。iconate.js実際の動作は以下のページで確認することができます。Awesomeのアイコンが使用されています。transformさせる前のアイコンと後のアイコン、そしてアニメーションの種類を選択した後に真下にあるアイコンをクリックするとそれに対応した動作が実行されます。アニメーションの種類は以下の通りです。rollOutRightrollOutLeftrubberBandzoomOutzoomInfadeOutfadeOutRightfadeOutLeftfadeOutTopfadeOutBottomhorizontalFlipverticalFlipbounceOutBottombounceOutTopbounceOutLeftbounceOutRightrotateClockwiserotateAntiClockwisetadaオプション項目のfromにアニメーション前のアイコンを、toにはアニメーション後のアイコン、そしてanimationには上記のアニメーション種類の中から好きなものを指定してあげます。Webサイトにちょっとした遊び心を取り入れたい時なんかに活用してみたいですね。気になる方は是非チェックしてみてください。Itemsはリスト内にある項目をスウィン...検索:プロフィールbl6.jp心がときめく「モノ」や「コト」を中心に紹介しています。レビューや日記なんかも。TwitterFacebookInstagram最近の記事2020.02.20いつもの音楽をハイレゾ級で。ソニーの完全ワイヤレス...ソニーからハイレゾ級高音質と優れた接続性を備えた小型・軽量の完全ワイヤレスイヤホ...2020.02.19三色ボールペンの青と緑を「黒」に変えるいつも仕事で使っているジェットストリームの三色ボールペン(+シャーペン付き)。こ...2020.02.18成城石井オリジナルコーヒー豆「ブラジルイパネマ」アマゾンで買い物中に見つけた成城石井オリジナルコーヒー豆「ブラジルイパネマ」。...2020.02.17梅しば1年のどこかで無性にカリカリ梅を食べたくなる時期がある。