我在为cufon制作渐变颜色时遇到麻烦(悬停时)。 它适用于(非悬停),但(悬停)它不会改变渐变颜色。 如果有人能帮助我,我将不胜感激?
Cufon部分:
Cufon.replace('h1', {
color: '-linear-gradient(white, black)',
fontFamily: 'Scriptina',
textShadow: '1px 1px rgba(0, 0, 0, 0.2)'
});
Cufon.replace('#nav a', {
hover: true
});
Cufon('#content h2', {
color: '-linear-gradient(#b7dded, 0.2=#70ceef, 0.5=#20b4e2, #b1dbeb)',
hover: {
textShadow: '2px 2px red',
color: '-linear-gradient(black, white)'
}
});
来自HTML:
<nav class="mid">
<ul class="tabs">
<li>
<a href="#" class="defaulttab" rel="tabs1">
<div class="lineRight">
<h5>TEXT 1</h5>
<p>Sub-Text1</p>
</div>
</a>
</li>
<li>
<a href="#" rel="tabs2">
<div class="lineMiddle">
<h5>TEXT 2</h5>
<p>Sub-Text2</p>
</div>
</a>
</li>
<li>
<a href="#" rel="tabs3">
<div class="lineMiddle ook">
<h5>TEXT 3</h5>
<p>Sub-Text3</p>
</div>
</a>
</li>
<li>
<a href="#" rel="tabs4">
<div class="lineLeft">
<h5>TEXT 4</h5>
<p>Sub-Text4</p>
</div>
</a>
</li>
</ul>
</nav>
答案 0 :(得分:0)
据我所知,cufon hover仅适用于链接。 你可以使用这样的东西
Cufon.replace('h1', { fontFamily: 'yourfont' });
Cufon('#yourid a', {
hover: {
color: 'green'
}
});
你的HTML看起来像这样
<a href="#">
<h5>h5 text</h5>
<p>some text</p>
</a>
那会起作用;)
答案 1 :(得分:0)
从我从规范中收集的内容(https://github.com/sorccu/cufon/wiki/Styling),您需要明确启用悬停:
Cufon.replace('h1', {
hover: true
});
话虽如此,为什么不使用@font-face
?