【Ninja】jQueryとCSS3アニメーションで作る何度もクリックしたくなる「ページトップ」ボタン / SQUEEZE - Web Design Studio -

前回の記事『Webデザインの参考にしたい遊び心あふれる「ページトップ」ボタン9個』にならって、jQueryとCSS3アニメーションを使って遊び心あふれる何度もクリックしたくなる「ページトップ」ボタン作成してみました。 Ninjaページトップボタンブックマークバーとスクロールアニメーションを活かしたページトップボタンにしてみました。サンプルページをご覧ください。 サンプルページ » 忍者登場はCSSスプライトアニメーションコマ送りでアニメーションさせるため、1枚のPNG画像に32px×32pxの絵を10個並べました。マウスオーバーした時に、X軸方向に-32pxずつ背景画像がずれることでアニメーションしているように見えます。 .ninja{ display:block; width:32px; height:32px; background:url(images/ninja.png) no-r

[pokotanu]

ページトップへ

[kick178]

押す前がかわいい。ベロンとめくれて鉤縄を投げる準備してくれてるｗ

[miguse]

かっこいい

[kyotaweb]

おもしろいｗ

[mzkzzz]

いけてる！！

[takahashitakashi]

ギミックがおもしろい。

[actywave]

完成度高いw アイデアだね〜w

[yohoojapan]

１

[tiroruchoco]

【Ninja】jQueryとCSS3アニメーションで作る何度もクリックしたくなる「ページトップ」ボタン / SQUEEZE - Web Design Studio -

[poppun1940]

前回の記事『Webデザインの参考にしたい遊び心あふれる「ページトップ」ボタン9個』にならって、jQueryとCSS3アニメーションを使って遊び心あふれる何度もクリックしたくなる「ページトップ」ボタン作成してみました。 Ni

[monbran4989]

すごい。使い道が見つからないけどｗ

[purple2sky]

【Ninja】jQueryとCSS3アニメーションで作る何度もクリックしたくなる「ページトップ」ボタン / SQUEEZE - Web Design Studio -

[ymn]

GG忍がプレイしたくなっていたときに見てしまった。

[whey]

ページトップ, いつか使う

[inulab]

前にハズレ付きの犬シルエットでやろうと思ったけど考えただけで満足しといてやった

[squeezejp]

にんじゃりばんばん