人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

下記の丸のアニメーションのような物をjQueryで表現するには、どうすればよいでしょうか?

http://www.carlosousa.net/


●質問者: makocan
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● だわかき
●0ポイント

jQueryは不要です。
HTMLだけで記述できます。

下記サイトをご覧下さい。
http://homepage1.nifty.com/silabel/net/gazo_mouse.html


makocanさんのコメント
? これはただのオンマウスイベントの説明ではないでしょうか? 該当のアニメーションの参考になるものはどこにありますでしょうか?

makocanさんのコメント
要するにURLにあるドーナッツ型の円のアニメーションを表現したいのです。

2 ● Cherenkov
●100ポイント ベストアンサー

そのサイトはcss3でやってます。

.skills ul li .icon:hover {
 border: medium none;
 box-shadow: 0 0 0 100px #FFD2B0 inset;
 top: -10px;
}
.skills ul li .icon {
 animation: 5s linear 0s normal none infinite iconColor;
 animation-play-state: running;
 border: 10px solid #2AD2B0;
 border-radius: 130px 130px 130px 130px;
 height: 150px;
 margin: 0 auto;
 padding: 20px;
 position: relative;
 top: 0;
 transition: all 0.2s ease 0s;
 width: 150px;
}

このへん。

参考

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ