jQuery提供的animate()方法可以实现一些简单的动画效果,但是其核心库不提供颜色动画的效果,如果想实现颜色动画,需要下载相关插件。

但是,animate()的参数中有一个complete,通过它可以设置动画完成之后的执行函数,这时可以改变颜色。

                  

 <script type="text/javascript">
$("#btn").click(function() {
$("div").animate({
width: 100,
height: 100
}, {
duration: 3000,
complete: function() {
$("div").css("background-color", "red");
}
});
});
</script>

jQuery animate() 改变颜色的更多相关文章

  1. jquery animate 改变元素背景颜色

    通过animate不能直接设置css样式可以通过https://cdnjs.cloudflare.com/ajax/libs/jquery-color/2.1.2/jquery.color.min.j ...

  2. jquery动态改变背景颜色插件

    GETHUB下载地址 背景颜色用animate方法时时无法改变颜色的 所以要使用插件进行补充. 用法: <!DOCTYPE html> <html> <head> ...

  3. jQuery 实现改变图片指定区域的颜色

    javascript本身无法改变图片的颜色,不过我们可以通过一些技巧来实现一样的效果. 1.首先我们要知道图片哪些区域需要改变颜色,这里我们可以用执点地图的方法来弄 例1: <img src=& ...

  4. jQuery animate() 方法

    定义和用法 animate() 方法执行 CSS 属性集的自定义动画. 该方法通过 CSS 样式将元素从一个状态改变为另一个状态.CSS属性值是逐渐改变的,这样就可以创建动画效果. 只有数字值可创建动 ...

  5. jquery animate 动画效果使用解析

    animate的意思是:使有生气:驱动:使栩栩如生地动作:赋予…以生命作为形容词:有生命的:活的:有生气的:生气勃勃的 先看动画效果:http://keleyi.com/keleyi/phtml/jq ...

  6. echarts改变颜色属性的demo

    一:柱状图改变颜色 图片.png 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...

  7. 【前端统计图】echarts改变颜色属性的demo

    一:柱状图改变颜色 图片.png 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...

  8. jquery animate()方法 语法

    jquery animate()方法 语法 作用:animate() 方法执行 CSS 属性集的自定义动画.该方法通过CSS样式将元素从一个状态改变为另一个状态.CSS属性值是逐渐改变的,这样就可以创 ...

  9. jquery动态改变div宽度和高度

    效果体验:http://keleyi.com/keleyi/phtml/jquery/23.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD X ...

随机推荐

  1. IDEA操作maven时控制台中文乱码

    windows环境下,Intellij idea12中maven操作时,控制台中文乱码问题(编译报错或者clean install时出现的其他错误描述乱码) 在cmd中mvn中文正常显示,log4j打 ...

  2. 一:JavaWeb和Tomcat的安装

    1.Java Web 是java技术用来解决相关web互联网领域的技术总和. 2.Servlet是Java Servlet的简称,称为小服务程序或服务器连接器,用Java编写的服务器端程序 3.JSP ...

  3. eclipse安装Android插件

    1.首先下载Eclipse for android,点击进入.下载这个版本可以省去ADT配置() 2.下载符合你电脑的版本 2.现在Android SDK,地址:http://tools.androi ...

  4. Django 路由系统URL 视图views

    一.Django URL (路由系统) URL配置(URLconf)就像Django 所支撑网站的目录.它的本质是URL模式以及要为该URL模式调用的视图函数之间的映射表:你就是以这种方式告诉Djan ...

  5. REST framework 视图层

    我们之前写的  get  post  请求 要写很多 我们现在可以使用rest——framework给我们封装好的类 GenericAPIView 给我们提供了自动匹配验证的信息内部封装 from r ...

  6. Python实例---CRM管理系统分析180331

    注意:一个项目基本都设计增删改查,且第一个需要做的就是设计表结构 思维导图: 组件使用: Django  +   bootStrap  +   Jquery 数据库表结构设计: 外键关联: 2种方式, ...

  7. 铁乐学Python_day12_装饰器

    [函数的有用信息] 例: def login(user, pwd): ''' 功能:登录调用 参数:分别有user和pwd,作用分别是用户和密码: return: 返回值是登录成功与否(True,Fa ...

  8. docker 自制alpine-lnp镜像

    简单粗暴点吧 jenkins 镜像下载:docker pull jenkins:alpine dockfile 原地址:https://gist.github.com/phith0n/373cc078 ...

  9. September 24th 2017 Week 39th Sunday

    To live is the rarest thing in the world. Most people exist. That is all. 生活是世间最罕见的事情:生存,却是世间最常见的事情: ...

  10. 安装64位php开发环境

    最近听说PHP5.4速度很快,所以想建立一个本地环境测试下.我打算用本地windows xp sp3下安装PHP5.4.8.Apache2.4.3和Mysql5.5.28. 首先去下载PHP.Apac ...