アニメーション

jQuery製クールに開く横型サブナビゲーション

Posted: 2011.09.29 / Category: javascript / Tag: jQuery, アニメーション

スライドして開く横型のサブナビゲーションを作ってみました。しかし、あまり柔軟性がよろしくないので局地的にしか使えなませが、もし興味あったら、、、。

Posted: 2011.09.16 / Category: javascript / Tag: CSS3, jQuery, アニメーション

スマートフォン向けのサイトでアニメーションさせたいとき、PCサイトのようにjQueryのanimateを使ってしまうと動きがガタガタになってしまい。これがWebアプリの限界なのかー。って叫びそうになりますが、そんなときはcss3の「translate3d」を使えば滑らかに動きますよ。

Posted: 2011.08.10 / Category: javascript / Tag: jQuery, アニメーション

通常はマウスホイールでのスクロールするとピタッと止まりますが、止まるときに余韻が残ったりするとなんだかリッチな感じがしますよね。
ということでjQueryで、その動きを作ってみました。

Posted: 2011.07.28 / Category: HTML&CSS / Tag: CSS3, アニメーション

Flashサイトではよく見かけていると思いますが、画像にマウスオーバーするとボーダーが内側にアニメーションするあれをCSS3でやってみました。
Webkit系列やOperaでご覧下さい。Firefoxだとがたがたします、、、、

Posted: 2011.07.21 / Category: javascript / Tag: jQuery, アニメーション

通常のWebサイトは縦長でマウスホイールで下に移動していきますが、最近よく見かけるようになった横長タイプのコンテンツをjQueryを使用して作成する方法をご紹介します。
機能としてはマウスホイールで横に移動と、ナビゲーションボタンをクリックで指定位置までスライドするということをやってみます。

Posted: 2011.06.15 / Category: HTML&CSS / Tag: CSS3, アニメーション

css3はアニメーションもできてしまうわけですが、ここではわりと簡単につくれるマウスオーバーアニメーションをご紹介いたします。
Chrome、Firefoxで動作確認しております。