タグ

ブックマーク / css.webcreativepark.net (1)

  • ロールオーバー-opacity-CSS TIPS

    マウスオーバーの際に画像の輝度を上げ、ロールオーバーしたように見せる方法です。 XHTMLソース <a href="http://blog.webcreativepark.net"><img src="./tor.gif" alt="to-R"/></a> CSSソース a:hover img{ opacity:0.8; filter: alpha(opacity=80); } サンプルをみる opacityはCSS3で追加される予定の透明度に関するプロパティになります。 ただし、IEを除くモダンブラウザでは先行実装している為、使用しても正常に動作します。 IEはfilterを使いalphaを変更することにより透明度を変更することが可能です。 この方法を使用するとマウスーオーバーの際に透明度が下がり輝度が上がったように見えるため、ロールオーバーが行われたように表示されます。 注意点としては

    poyo
    poyo 2012/11/04
  • 1