Cufon： <span>内部的</span>悬停效果

Question

好的，我整天在Google上搜索，阅读并尝试了所有建议，但似乎没有任何效果！ 我有这个：

<style>
   .riga a {
  color:#383838;
   }
   .riga a:hover {
      color:#931015;
   }
</style>    


<a href="news2.html" rel="shadowbox;width=470;height=350">
   <span class="title cub">Lorem ipsum</span>
   <span class="text cul">dolor sit amet</span>
</a>

其中cub是粗体字体，而cul是浅色字体

显然，对的悬停效果不起作用，因此我尝试使用以下方法进行控制：

Cufon.replace('.riga a .title', { fontFamily: 'hell_bd', hover: true,  hoverables: { span: true }, hover: {color: '#931015'}  });
Cufon.replace('.riga a .text', { fontFamily: 'hell_lt', hover: true,  hoverables: { span: true }, hover: {color: '#931015'} });

而且效果有效，但仅将单个跨度悬停在“标题”或“文本”上，而不覆盖<a> ...

将鼠标悬停在<a>之外的对象上或直接悬停在<a>上的效果非常好！ 所以我的问题是：
如何通过<a>对其内部的对象进行悬停效果？

感谢您的帮助！

Answer 1

我认为您需要在css中设置悬停颜色（就像您正在做的那样），而不是在javascript中。 您也可以尝试通过以下方式定义cufon：

Cufon.replace('.riga a', { fontFamily: 'hell_bd', hover: true,  hoverables: { span: true }  });
Cufon.replace('.riga a .text', { fontFamily: 'hell_lt', hover: true,  hoverables: { span: true } });