jquery——动画
1.通过animate方法可以设置元素某属性值上的动画
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>动画</title>
<script type="text/javascript" src="jquery-1.12.4.min.js"></script>
<style type="text/css">
.box{
width:100px;
height:100px;
background-color: hotpink;
}
</style>
<script type="text/javascript">
$(function () {
//参数:
// 1.属性设置{pra1:1,pra2:2}
// 2.speed 时间 ms
// 3.swing(默认值) 开始和结束慢速,中间快速 linear 匀速
// 4.回调函数:动画结束后要做的事情
$('#div1').animate({width:200,height:200},1000,'linear',function () {
$(this).animate({marginLeft:500},1000);
});
})
</script>
</head>
<body>
<div id='div1' class="box"></div> </body>
</html>
回调函数很强大哦,可以做很多事~
2.each 相当于for循环,这个each()中的第一个参数是索引值
$(function () {
$('.list li').each(function (index) {
});
})
jquery——动画的更多相关文章
- jQuery动画的实现
没有引入deferred机制,其余流程都有了 //////////// //创建动画缓动对象 // //////////// function Tween(value, prop, animation ...
- 深入学习jQuery动画控制
× 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话 jQuery动画可以使用fade.hide.slide等方法实现基本动画效果,可以使用animate实现自定义动画,甚 ...
- 深入学习jQuery动画队列
前面的话 队列实现是jQuery非常棒的一个拓展,使用动画队列可以使动画更容易实现.本文将详细介绍jQuery动画队列 queue() queue()方法用来显示在匹配的元素上的已经执行的函数队列 q ...
- jquery动画,基础以及我发现的新大陆
$.animate()在jquery官方介绍有2中方式,其实我发现的新大陆也是第二种方式的扩展! 一.$.animate( properties [, duration ] [, easing ] [ ...
- 让网站动起来!12款优秀的 jQuery 动画插件推荐
如今,大多数设计师和开发人员被要客户要求开发动态的网站.创造视觉震撼和醒目的动态网站是艰巨的任务,因为它需要大量的努力和创造力.在网络上有大量的工具和插件可用于创建网站动画.许多开发人员正在使用 HT ...
- jQuery动画特效实例教程
本文以实例形式详细讲述了jQuery动画特效的实现方法. 1.自制折叠内容块 内容块如下: <div class="module"> <div cla ...
- JQuery动画效果
jquery动画效果常用方法 1.show()显示效果语法:show(speed,callback)Number/String,Function speend为动画执行时间,单位为毫秒.也可以为slo ...
- jQuery动画特效笔记
show().hide().fadeIn().fadeOut().slideDown.slideUp.slideToggle()都接受可选的时长和回调参数(选项对象参数). toggle(durati ...
- Velocity – 另外一款加速的 jQuery 动画插件
Velocity 是一款 jQuery 插件,重新实现了 $.animate() 方法,提供更高的性能(比 CSS 动画还更快),同时包括一些新的功能,以改进动画工作流程.Velocity 除了包括所 ...
- 有时候就是看不进论文-jQuery动画特效篇&MySQL
hi 早上知道新的乱斗模式后,没忍住开了几把,然后就无心论文了...用这个来破吧 1.jQuery -----动画特效----- ----调用show()和hide()方法显示和隐藏元素 show() ...
随机推荐
- Sublime Text 全程指南(转载)
摘要(Abstract) 本文系统全面的介绍了Sublime Text,旨在成为最优秀的Sublime Text中文教程. 更新记录 2014/09/27:完成初稿 2014/09/28: 更正打开控 ...
- File:isctype.c Line 68
刚接触DSP,拿来别人的代码,编译时,发现如下错误: 百思不得琪姐,一番调查之后,发现自己的工程worksapce中有中文路径,怎一个fuck了得.
- UVa11624(逃离火焰问题)
#include"cstdio" #include"queue" #include"cstring" using namespace std ...
- Python模块-logging模块(二)
logging模块记录日志有四个主要类:logger,handler,formatter,filter logger提供了应用程序可以直接使用的接口,每个程序在输出信息之前都要获得一个Logger h ...
- Project Web Server PSI 接口一些常用操作
对Project Web Server进行二次开发,每天都把自己折腾到12点以后才休息,到处都是坑,研究那些烦人的PSI,国内根本查不到PSI相关的资料,对照API文档一点点谷歌资料,全部英文资料,开 ...
- nginx gzip
# 开启gzip gzip on; # 启用gzip压缩的最小文件,小于设置值的文件将不会压缩 gzip_min_length 1k; # gzip 压缩级别,1-10,数字越大压缩的越好,也 ...
- C++之Stack模板类
假设有这样一种情况:某人将一车文件交给小王.倘若小王的抽屉是空的,那么小王从车上取出最上面的文件将其放入抽屉:倘若抽屉是满的,小王从抽屉中取出最上面的文件,放入垃圾篓:倘若抽屉即不空也未满,那么小王抛 ...
- linux压缩包安装jdk
1.下载jdk压缩包 $ wget http://download.oracle.com/otn-pub/java/jdk/8u144-b01/090f390dda5b47b9b721c7dfaa00 ...
- 报错:org.springframework.dao.InvalidDataAccessApiUsageException: Executing an update/delete query; nested exception is javax.persistence.TransactionRequiredException: Executing an update/delete query
service实现类上没有加@transaction 事务注解
- 《精通Spring4.X企业应用开发实战》读后感第五章(FactoryBean)