<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
var div = $("div");
startAnimation();
function startAnimation(){
div.animate({height:300},"slow");
div.animate({width:300},"slow");
div.css("background-color","blue");
div.animate({height:100},"slow");
div.animate({width:100},"slow",startAnimation);
}
});
});
</script>
</head>
<body>

<button>Start Animation</button>
<div style="width:50px;height:50px;position:absolute;left:10px;top:50px;background-color:red;"></div>

jquery.animate用法的更多相关文章

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

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

  2. jQuery 动画用法

    jQuery动画: <head> <meta charset="UTF-8"> <title>Title</title> <s ...

  3. jQuery $.each用法[转]

    jQuery $.each用法 以下内容非原创,来自百度文库http://wenku.baidu.com/view/4796b6145f0e7cd18425368e.html 通过它,你可以遍历对象. ...

  4. 【转】使用jquery animate创建平滑滚动效果

    这篇文章主要介绍了使用jquery animate创建平滑滚动效果,效果可以滚动到顶部.到底部或页面中指定地方,生要的是非常平滑,很舒服,需要的朋友可以参考下 滚动到顶部: $('.scroll_to ...

  5. jQuery 事件用法详解

    jQuery 事件用法详解 目录 简介 实现原理 事件操作 绑定事件 解除事件 触发事件 事件委托 事件操作进阶 阻止默认事件 阻止事件传播 阻止事件向后执行 命名空间 自定义事件 事件队列 jque ...

  6. jquery cookie 用法

    jquery cookie 用法 $.cookie("name","value","options")  当不设置options时,此coo ...

  7. [转]Jquery Ajax用法

    原文地址:http://www.php100.com/html/program/jquery/2013/0905/6004.html jQuery学习之jQuery Ajax用法详解 来源:   时间 ...

  8. JQuery datepicker 用法

    JQuery datepicker 用法   jQuery UI很强大,其中的日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加 ...

  9. jquery animate函数实现

    jquery animate 函数 实现动画效果 参数一 比如高度宽度 之类的:'-=50' 参数二 速度之类 <html xmlns="http://www.w3.org/1999/ ...

随机推荐

  1. Android ListView快速定位（二）

    方法二:android:textFilterEnabled="true" + Filter 这个属性在android.widget.AbsListView下,要求adapter必须 ...

  2. Golang－interface（四 反射）

    github:https://github.com/ZhangzheBJUT/blog/blob/master/reflect.md 一 反射的规则 反射是程序执行时检查其所拥有的结构.尤其是类型的一 ...

  3. Vs 2008 解决方案的目录结构设置和管理（转）

    http://blog.csdn.net/lcj_cjfykx/article/details/8632459 MS的这个IDE,实在庞杂得恐怖.从大学开始,我就一直用VC的各个版本写程序至今,细细想 ...

  4. 学习笔记之Linux开发(C语言)

    第二章 Linux下C程序开发环境 vi编辑器 gcc 第三章 Linux基础 Kernel Shell 第三章 Linux技术实验 ls -l 以长格式的形式查看当前目录下所有可见文件的详细属性. ...

  5. 如何打开“USB调试”模式？

    请首先确认您的系统版本, 点击「设置」-「关于手机」查看您当前的手机版本号. 如果您使用的是 Android 3.2及以下系统,请按以下步骤操作: STEP1:在应用列表选择「设置」进入系统设置菜单: ...

  6. codereview介绍

    1. 定义: Code review is systematic examination (often known as peer review) of computer source code. I ...

  7. C# 工厂模式示例

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace 工厂模式 ...

  8. Android（java）学习笔记119：继承中父类没有无参构造

    /* 如果父类没有无参构造方法,那么子类的构造方法会出现什么现象呢? 报错. 如何解决呢? A:在父类中加一个无参构造方法 B:通过使用super关键字去显示的调用父类的带参构造方法 C:子类通过th ...

  9. setTimeout和setImmediate以及process.nextTick的区别

    在javascript中我们了解到了setTimeout和setInterVal函数事件队列(任务队列)的相关知识,除了setTimeout和setInterval这两个方法外,Node.js还提供了 ...

  10. 不使用Math.random实现随机数。

    var rand = (function(){ var today = new Date(); var seed = today.getTime(); function rnd(){ seed = ( ...