Cufon 鼠标悬停

发布于 2024-10-17 04:33:58 字数 499 浏览 7 评论 0原文

我有一些像这样的 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 有效，但是鼠标悬停时文本颜色不会改变。

原文

I have some HTML like this:

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

I use this code for Cufon:

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

My CSS:

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

Cufon works, however the text color does not change on mouse-over.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

国粹 2024-10-24 04:33:58

出于性能原因，默认情况下不启用 :hover，这意味着您必须为需要它的元素单独启用它。您可以通过以下方式执行此操作：

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

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

For performance reasons :hover is not enabled by default, which means that you’ll have to enable it separately for elements that need it. You can do this with:

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

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

回复收藏 0 原文

羁绊已千年 2024-10-24 04:33:58

你的按钮是链接吗？这是我在此页面上进行的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>

Your buttons are links? This is the CSS for what I've got going on this page: http://ianmartinphotography.com/test-site/

My cufon buttons are at bottom.

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>

回复收藏 0 原文