<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

    div{

        width: 100px;

        height: 100px;

        background: green;

    }

    </style>

    <script src="js/jquery-1.12.4.min.js"></script>

    <script>

    $(function(){

        // $('div').animate(字典的形式写动画过程, 动画所需时间, 运动曲线, 回调函数)

        // 1、动画过程：{} -- css多属性写法相同

        // 2、时间以毫秒为单位,  600

        // 3、运动曲线：swing  linear

        // 4、回调函数：就是匿名函数function(){} -- 作用：当动画完成之后执行的命令

        $('div').eq(0).animate({'width':'800px', 'height':'300px','background':'red'}, 1000, 'swing', function(){

            alert('动画完成了')

        })

        // $('div').eq(1).animate({'width':'800px'}, 1000, 'linear')

        // ****animate不支持变色动画

    })

    </script>

</head>

<body>

    <div></div>

    <!-- <div></div> -->

</body>

</html>

　　

自定义动画函数JQuery实现的更多相关文章

  1. javascript 自定义动画函数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  2. python全栈开发day48-jqurey自定义动画，jQuery属性操作，jQuery的文档操作，jQuery中的ajax

    一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...

  3. jQuary总结8:动画操作-自定义动画

    1 自定义动画 语法: jQuery对象.animate(json,[speed],[easing],[callback]) 参数详解: -1 json:要执行动画的CSS属性,带数字(必选) -2  ...

  4. 深入学习jQuery自定义动画

    × 目录 [1]属性对象 [2]可选参数 [3]选项参数 前面的话 很多情况下,前面介绍的jQuery动画的简单效果无法满足用户的各种需求,那么就需要对动画有更多的限制,需要采取一些高级的自定义动画来 ...

  5. jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

    一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...

  6. jquery的动画函数animate()讲解一

    jquery animate 动画效果使用说明 animate( params, [duration], [easing], [callback] ) 用于创建自定义动画的函数. 这个函数的关键在于指 ...

  7. jquery接触初级-----juqery 动画函数

    1. window.onload(), 一次只能保存对一个函数的引用:如果多次调用,他会自动用后面的函数覆盖前面的函数 2.$(document).ready(); 会在现有行为上追加新的行为,这些函 ...

  8. jQuery 自定义动画效果

    <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js&qu ...

  9. jQuery中关于如何使用animate自定义动画

    动画 animate() 01.animate()方法的简单使用 有些复杂的动画通过之前学到的几个动画函数是不能够实现,这时候就是强大的animate方法了. 操作一个元素执行3秒的淡入动画,对比下一 ...

随机推荐

  1. http三次握手四次挥手

    最近一直忙于看前端vue相关内容,后端相关内容没有跟进,文章停了3周,,,哎,还是懒吧!子曰生命在于运动,该学习还是要学的,文章嘛也还是要整理滴,不扯了--- 参考: https://blog.csd ...

  2. 浅入分析Linux

    Linux 操作系统必须完成的两个主要目的 与硬件部分交互, 为包含在硬件平台上的所有底层可编程部件提供服务 为运行在计算机系统上的应用程序(即所谓的用户空间)提供执行环境 一些操作系统运行所有的用户 ...

  3. [巩固C#] 三、依赖注入是什么？

    阅读目录   接口 在说依赖注入之前,先了解下什么是接口. 我们在学编程的时候都知道,接口的相关规则:(来源百度百科) 1. 接口是一个引用类型,通过接口可以实现多重继承. 2. C#中接口的成员不能 ...

  4. C#中事件的一些总结

    事件中  sender和e  事件中不同的对象 object  sender  是事件的对象 eventages e   是事件对象传递过来的参数对象 如 private button_click(O ...

  5. [JAVA][Liferay] Configure sharding in multiple sites

    create databases first portal-ext.properties配置 hibernate.dialect=org.hibernate.dialect.PostgreSQLDia ...

  6. Hibernate课程 初探一对多映射4-2 cascade级联属性

    1 级联属性:hibernate一方和多方设置关联关系,当一方发生相应修改时(见下表),多方不用进行显式修改,也能进行相应修改.   级联在一方和多方xml中都可以设置 属性值 含义和作用 all 对 ...

  7. Django实战-用户注册和登陆系统

    1.环境搭建和创建项目 1.环境搭建 每当我们开始一个新项目的时候,通常都会搭建一个全新.独立.隔离的项目环境,这样做的好处自然不必多说.有很多种建立项目虚拟环境的工具,使用比较普遍的是Python中 ...

  8. html 01前沿-web介绍

    1. 认识网页 网页主要由文字.图像和超链接等元素构成.当然,除了这些元素,网页中还可以包含音频.视频以及Flash等. 2. 浏览器(显示代码) 浏览器是网页显示.运行的平台,常用的浏览器有IE.火 ...

  9. (转)ArcEngine读取数据（数据访问）

    读取和访问数据是进行任何复杂的空间分析及空间可视化表达的前提,ArcGIS支持的数据格式比较丰富,下面就这些格式Shapefile.Coverage.Personal Geodatabase.Ente ...

  10. 菜鸟 学注册机编写之 Android app

    0x00前言 环境及工具: 手机    Nexus 4(己root) 系统版本    Android 5.01 工具    AndroidKiller_V1.2 关于Android平台app注册机的编 ...