我正在尝试制作一小段脚本,当鼠标悬停在上面时会改变一串文本的颜色。
HTML:
<span class="headinglink" id="firstheading"><h1><a href="http://localhost/page.php">Link1</a></h1></span>
JavaScript:
$('#firstheading').hover(function () {
$(this).find('h1').stop().animate({ color: "#53799E" }, 1000);
}, function() {
$(this).find('h1').stop().animate({ color: "#F58426" }, 1000);
});
奇怪的是,当我打开 Chromes 元素检查器时,我实际上可以看到上面元素的 RGB 值发生了变化,例如:
<h1 style="color: rgb(245, 132, 38); ">
但元素实际颜色不会改变。就像外部 CSS 仍然在编写上面的内联 CSS 一样。
有人知道如何解决这个问题吗?我应该完全放弃这个元素的外部 CSS 吗?
(PS 我的 jQuery 和 UI 库都链接得很好)。