タグ

ブックマーク / bl6.jp (1)

  • jQueryでマウスオーバーした時に要素を全体的に拡大するやつを作ってみる – bl6.jp

    すごくどうでもいい内容なんですが、ちょっとやってみたかったので素人ながら作ってみます。ある要素、例えばa要素なんかにマウスオーバーした時にちょっとだけ拡大して強調させたいなどといった時に使えるかもしれません。分かりづらそうなのでサンプルも作ってみました。おかしい部分やもっとこうした方がいいみたいなことがあれば是非教えていただけるとうれしいです。 (※ CSS3だけでもできましたので追加しておきます。) [ads_center] CSStransitionを使って背景色もアニメーションで変わるようにしています。要素の拡大はjQueryのanimateを使ってpaddingの値を変えています。で、普通にpaddingの値だけ変えると左上が固定されて右下方向だけアニメーションして拡大していくので、拡大する分positionでマイナスの値も指定します。ちょっと分かりずらいので図にするとこんな感じ

    jQueryでマウスオーバーした時に要素を全体的に拡大するやつを作ってみる – bl6.jp
  • 1