IE6 mouseoverするとボタンの背景が消えるエラー解決策
問題
ここにmouseoverするとopacity 0.75がかかるボタンがあります。(jsでopacity指定)
IE6で見たとき、mouseoverするとボタンが消えてしまう現象をどうにかしてほしい。
width: 150px;
height: 37px;
border: none;
background-image: url("/common/○○/img/○○.png");
background-repeat: no-repeat;
background-position: 0 -50px;
cursor: pointer;
*border-width: 0;
解決策
IEではopacityが使えない。filterを使います。
ただ、今回はopacity指定はjsでやっていて、js触るの禁止で、
cssで直すしか道がない場合の解決策です。
mouseoverすると消えてみえるのは、opacityが0になっていると思われるので、
opacityを100%にします。
*filter: alpha(opacity=100) !important; /* ie 6 7 */
だが、それだけだとmouseoverでボタンは消えたままでした。
hasLayoutをtrueにする必要があり、*zoom:1を足しました。
width: 150px;
height: 37px;
border: none;
background-image: url("/common/○○/img/○○.png");
background-repeat: no-repeat;
background-position: 0 -50px;
cursor: pointer;
*border-width: 0;
*zoom: 1;
*filter: alpha(opacity=100) !important;
これで消える現象はなくなりました。
参考:
Internet Explorer でフォームボタンの背景画像が表示されない
http://www.ilovex.co.jp/blog/system/webconsulting/internet-explorer.html
CSSで半透明にできるOpacityプロパティとIEでの問題について
http://blog1.erp2py.com/2011/04/cssopacityie.html
Author And Source
この問題について(IE6 mouseoverするとボタンの背景が消えるエラー解決策), 我々は、より多くの情報をここで見つけました https://qiita.com/rico/items/ff9ae440f1d5141db529著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .