如何避免鼠標懸停時IE8/9中的漸變背景閃爍

當我將以下CSS應用於IE8/9，並將鼠標懸停在空白區域時，背景將閃爍。如何避免鼠標懸停時IE8/9中的漸變背景閃爍

下面是HTML

<div style="width: 100%;"> 
    <ul> 
     <li> 
      <a class="content" href="javascript:;"> 
       Please mouse over after the words 
      </a> 
     </li> 
     <li> 
      <a class="content" href="javascript:;"> 
       Please mouse over after the words 
      </a> 
     </li> 
    </ul> 
</div>

這裏是CSS設置

ul { 
    list-style: none; margin: 0px; padding: 0px; border: 0px; position: relative; 
} 
li { 
    padding: 0px; position: relative; 
    cursor: pointer; 
} 
.content { 
    padding: 3px 6px; 
    border-radius: 4px; 
    text-decoration: none; 
    display: block; 
} 
.content:hover { 
    margin: 0; 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e3f4fd', endColorstr='#c7e9f9',GradientType=0); 
}

可以在jsfiddle

來源

2013-05-21 jumperchen

從GH看沒什麼發生在所有 –

試運行的例子，在默認情況下

給它一個堅實的背景顏色

http://jsfiddle.net/9yy3y/7/

.content { 
    padding: 3px 6px; 
    border-radius: 4px; 
    text-decoration: none; 
    display: block; 

    background:#fff; 
}

來源

2013-05-21 07:04:09 Kieran

是的，添加堅實的背景色可以解決這個問題，爲IE8/9。 – jumperchen

是的，我也同意這一點。剛剛添加了一個堅實的背景顏色，這解決了在IE9鼠標懸停閃爍的問題。 – Devner

您可以通過添加。內容類列表項，並在你的CSS目標列表裏面a標籤來解決這個問題。

HTML：

<div style="width: 100%;"> 
<ul> 
    <li class="content"> 
     <a href="#"> 
      Please mouse over after the words 
     </a> 
    </li> 
    <li class="content"> 
     <a href="#"> 
      Please mouse over after the words 
     </a> 
    </li> 
</ul> 
</div>

CSS：

ul { 
    list-style: none; margin: 0px; padding: 0px; border: 0px; position: relative; 
} 
li { 
    padding: 0px; position: relative; 
    cursor: pointer; 
} 
.content a { 
    padding: 3px 6px; 
    border-radius: 4px; 
    text-decoration: none; 
    display: block; 
} 
.content:hover a { 
    margin: 0; 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e3f4fd',  endColorstr='#c7e9f9',GradientType=0); 
}

工作例如：

http://jsfiddle.net/9yy3y/8/

這消除了在IE9中的閃爍 - 我無法測試任何較低的JSFiddle不喜歡IE9的8或7的模擬（或根本不支持它們...）

來源

2013-05-21 07:04:40 MassivePenguin

如何避免鼠標懸停時IE8/9中的漸變背景閃爍

回答

相關問題