Cufon鼠标悬停

时间:2011-02-10 11:51:51

标签: javascript html css mouseover cufon

我有一些像这样的HTML:

<div class="button2" onclick="">
 <div class="button_text">LOCATE STORES</div>
 <div class="button_arrow"></div>
</div>

我将此代码用于Cufon:

Cufon.replace('div.button2', { fontFamily: 'Bliss2H', hover: true, fontSize: '12px' });

我的CSS:

div.button2 {
  color: #d79645;
}
div.button2:hover {
  color: white!important;
}

Cufon可以正常工作,但鼠标悬停时文字颜色不会改变。

3 个答案:

答案 0 :(得分:2)

出于性能原因:默认情况下不启用悬停,这意味着您必须为需要它的元素单独启用它。你可以这样做:

Cufon.replace('h1', {
    hover: true
});

https://github.com/sorccu/cufon/wiki/styling

答案 1 :(得分:0)

你的按钮是链接?这是我在这个页面上的内容的CSS:http://ianmartinphotography.com/test-site/

我的cufon按钮位于底部。

h3  {color: #79868e; font-family: helvetica; font-size: 21px; margin:5px 0 0 0; } 
a:link    {color: #555055; text-decoration: none; outline:none;}
a:visited {color: #555055; text-decoration: none; outline:none;}
a:hover   {color: #79868e; text-decoration: none; outline:none;}

<div id="about"><h3><a href="about">about</a></h3></div>

答案 2 :(得分:0)

你尝试过#FFFFFF而不是白色吗?

难道你不能简单地拥有:     div.button2:悬停{color:#FFFFFF;}

没有!重要吗?