jQuery .animate(） 无法正常工作

jQuery .animate() not working properly

本文关键字：常工作 工作 animate jQuery      更新时间：2023-09-26

我正在设计一个网站，为了效果，我遇到了以下一组jquery代码，用于通过动画实现文本颜色变化。但它不起作用，我不确定出了什么问题。

吉斯菲德尔

以下是我目前遇到问题的代码：

j查询： 

$('.list-5 li a').hover(function() {
    $(this).stop().animate({ color: '#fff' })
}, function() {
    $(this).stop().animate({ color: '#0e1b23' })
})

.HTML：

  <div class="list-5">
    <ul>
     <li>
       <a href="#">Hello world</a> 
     </li>
    </ul>
  </div>
#FFFF是

无效的颜色。使用 #FFF 或 #FFFFFF 。

此外，默认的 jQuery .animate不会对颜色进行动画处理。你必须为此使用jQuery UI（或Color插件）。

  • 使用颜色插件演示：http://jsfiddle.net/FMTDp/13/
  • 使用 jQuery UI 的演示：http://jsfiddle.net/FMTDp/15/

您无法为颜色设置动画！ 

.animate({
        color: '#ffff'
    });

除非添加对 jQuery UI 的引用。

所有动画属性都应动画化为单个数值，除非如下所述;大多数非数字属性无法使用基本的 jQuery 功能进行动画处理（例如，宽度、高度或左侧可以动画化，但背景色不能，除非使用 jQuery.Color（） 插件）。

使用 jQuery UI 的工作演示

你需要使用 jQuery UI 或 jQuery 插件来为颜色设置动画。您还使用了错误的颜色代码，请使用#fff或#ffffff。

从动画：

例如，宽度、高度或左侧可以进行动画处理，但 背景颜色不能，除非使用 jQuery.Color（） 插件

注意：jQuery UI 项目通过允许 一些非数字样式，例如要动画的颜色。该项目 还包括通过 CSS 类指定动画的机制 而不是单个属性。

相关文章：