ZTMSブログ

自作フリーソフトやプログラミング雑記

 >  コンピュータ >  [IE8]グラデーションとhoverの注意点

[IE8]グラデーションとhoverの注意点

画面の左端にチラッと見えてて、マウスポインタを当てたらニョキッっと出てくるサイドバーを作りたくてこのようなHTML/CSSを書いた。
<!DOCTYPE html>
<html>
<head>
<style>
div {
position:fixed;
top:10px;
left:-40px;
background:#aaf;
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#ccccff,endcolorstr=#7777ff)";
}
div:hover {
left:0px;
}
div img {
width:48px;
height:48px;
}
</style>
</head>
<body>
<div><img><br><img></div>
</body>
</html>
動作デモ
これは問題ない。
しかしここから「backgroundはいらないよね~」と思って
background:#aaf;を消したら、マウスオーバーの挙動がおかしくなった。マウスが乗ってるのにhoverが解除されてしまう部分があって嫌な挙動になる。よくわからんが background は残しておかないといけないようだ。

コメント