HTML&CSS

CSS+jQueryで左右別々の背景にする

Posted: 2012.01.12 / Category: HTML&CSS, javascript / Tag: jQuery

センターのコンテンツを固定幅にして、その左右の背景を別の画像にしたいときtableを使用すれば簡単ですが、今の時代tableで囲んでしまうのはあれですね。
そこでcss+jQueryでなんとかしてみます。

Posted: 2011.12.21 / Category: HTML&CSS / Tag: アニメーション

CSS3でアニメーションが使えるようになり「hover」と組み合わせればマウスオーバーアニメーションならJSを使わなくても余裕な感じですが、クリックでアニメーションしたいときはそれらしいセレクターがないのでできないかなと思ってましたが、頑張ればできるらしいです。

Posted: 2011.12.13 / Category: HTML&CSS / Tag: LESS

CSSはシンプルなのでとてもわかりやすい言語ではありますが、その分サイトが肥大化していくとメンテナンス性が悪くなりますね。
LESSを使えばプログラム的な書き方ができるので、ムダなく効率的に管理できるみたいです。

Posted: 2011.08.02 / Category: HTML&CSS / Tag: HTML5

html5&css3でFlashのようにアニメーションが作れる「Adobe Edge」のPreviewバージョンが公開されたようなのでかるく使ってみました。

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

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

Posted: 2011.07.13 / Category: HTML&CSS, javascript / Tag: HTML5, jQuery

html5のcanvasを使えば色々できるみたいですが、リストとかのアイコンをcanvasで描いてしまうのはどうなんだろ。ということでやってみました。

Posted: 2011.07.08 / Category: HTML&CSS

TwitterはマウスオーバーするとRTボタンやリプライボタンが表示されますが、あれをCSSでお手軽に作ってみます。