2

如果我将鼠标悬停在链接上而不实际悬停在链接上,我想嗅探链接会变成的颜色。我想这样做的原因是我知道如何将其改回使用动画,因为可以通过各种可以动态应用的皮肤来设置颜色。我可以使用 javascript 或 jquery 来做到这一点(或者有其他方法吗)?

编辑:我已经使用 CSS 过渡实现了这一点,但我需要 IE9 及以下版本的 javascript

4

3 回答 3

6

不,不幸的是,这是不可能的:您可以使用它getComputedStyle()来检索有关伪元素 ( ::before/ ::after) 的信息,但不能检索:hover伪选择器。

参考:

于 2012-11-30T18:57:24.530 回答
4

您可以从样式表中获取值:http: //jsfiddle.net/wt3qQ/

// code I found here: http://catcode.com/dominfo/getstyle2.html
function getStyleBySelector( selector )
   {
       var sheetList = document.styleSheets;
       var ruleList;
       var i, j;

       /* look through stylesheets in reverse order that
          they appear in the document */
       for (i=sheetList.length-1; i >= 0; i--)
       {
           ruleList = sheetList[i].cssRules;
           for (j=0; j<ruleList.length; j++)
           {
               if (ruleList[j].type == CSSRule.STYLE_RULE && 
                   ruleList[j].selectorText == selector)
               {
                   return ruleList[j].style;
               }   
           }
       }
       return null;
   }

console.log(getStyleBySelector('a:hover').color);
console.log(getStyleBySelector('#link:hover').color);
于 2012-11-30T19:41:37.363 回答
3

如果您打算为颜色设置动画,那么(对于现代浏览器)您可以启用颜色的转换,这样它就会自动动画到它变成的任何东西:hover

要申请代码,您可以这样做

$('element').css({
   '-webkit-transition':'color 0.5s',
   '-moz-transition':'color 0.5s',
   '-o-transition':'color 0.5s',
   'transition':'color 0.5s',
});
于 2012-11-30T18:58:36.687 回答