亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

csshover.htc在IE7下使用:active偽類無(wú)效解決方法

  發(fā)布時(shí)間：2012-12-24 09:15:06   作者：佚名   我要評(píng)論
相信做前端開(kāi)發(fā)都知道，IE6、IE7都不支持:active偽類，IE6更甚，連:hover偽類都不支持。為了解決這個(gè)問(wèn)題，一般都會(huì)引入一個(gè)csshover.htc文件來(lái)解決,本文將介紹解決此問(wèn)題的實(shí)現(xiàn)過(guò)程，需要了解的朋友可以參考下
csshover
相信做前端開(kāi)發(fā)都知道，IE6、IE7都不支持:active偽類，IE6更甚，連:hover偽類都不支持。為了解決這個(gè)問(wèn)題，一般都會(huì)引入一個(gè)csshover.htc文件來(lái)解決。
目前該文件版本為3.11，
如果你發(fā)現(xiàn)自己使用的不是最新的版本，趕緊更新吧。
Bug
在使用過(guò)程中，發(fā)現(xiàn)IE7的:active居然不起作用。做了一番測(cè)試，最后發(fā)現(xiàn)，原來(lái)是選擇符權(quán)重的問(wèn)題。
失效的條件為：樣式選擇符都使用類選擇符。
示例代碼如下(需要IE7瀏覽)：

復(fù)制代碼
代碼如下:

<!doctype html>
<head>
<style>
body { behavior:url("csshover3.htc"); }
.d{
width:200px;
height:200px;
background:yellow;
}
.d:hover{
background:green;
}
.d:active{
background:red;
}
</style>
</head>
<body>
<div class="d"></div>
</body>

此時(shí)鼠標(biāo)按下時(shí)是不會(huì)有變化的。
解決方案
A.不使用類選擇器。可以使用元素選擇符，或id選擇符。
B.增加:active偽類的權(quán)重。
對(duì)于A方案，可以修改選擇符為：
-----------------------------

復(fù)制代碼
代碼如下:

div{}
div:hover{}
div:active{}

-----------------------------
或者：
-----------------------------

復(fù)制代碼
代碼如下:

#d{}
#d:hover{}
#d:active{}
<div id="d"></div>

-----------------------------
對(duì)于B方案，可以按權(quán)重增加方式使用選擇符：
-----------------------------

復(fù)制代碼
代碼如下:

div{}
.d:hover{}
#d:active{}
<div id="d" class="d"></div>

-----------------------------
或者增加選擇符：
-----------------------------

復(fù)制代碼
代碼如下:

.d{}
.d:hover{}
.b .d:active{}
<body class="b">
<div id="d" class="d"></div>
</body>

-----------------------------
原因
導(dǎo)致該問(wèn)題的原因，可能是因?yàn)榻o:hover和:active使用了同樣的類選擇符。此時(shí)需要給:active多增加一個(gè)類選擇符或ID選擇符，元素選擇符的權(quán)重還不夠。
htc文件是通過(guò)給元素添加類來(lái)實(shí)現(xiàn)效果變化，鼠標(biāo)按下時(shí)，會(huì)給元素添加兩個(gè)類:onhover和onactive，至于為何onactive的樣式?jīng)]生效，目前還不知道。

相關(guān)文章

最新評(píng)論