jquery中animate
类别:Web前端 浏览量:2638
时间:2014-8-10 jquery中animate
jquery中animate一、query中animate函数定义
animate(params, [duration], [easing], [callback])
各参数的说明如下:
params:一组包含作为动画属性和终值的样式属性和及其值的集合。
duration(可选):默认是 "normal"。动画时长,三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如:1000)。
easing(可选):规定在不同的动画点中设置动画速度的 easing 函数。要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing"。
callback:动画完成时执行的函数。
二、query中animate示例
// 在一个动画中同时应用三种类型的效果
$("#go").click(function(){
$("#block").animate({
width: "90%",
height: "100%",
fontSize: "10em",
borderWidth: 10
}, 1000 );
});
$("#right").click(function(){
$(".block").animate({left: '+50px'}, "slow");
});
$("#left").click(function(){
$(".block").animate({left: '-50px'}, "slow");
});
在600毫秒内切换段落的高度和透明度
$("p").animate({
height: 'toggle', opacity: 'toggle'
}, "slow");
用500毫秒将段落移到left为50的地方并且完全清晰显示出来(透明度为1)
$("p").animate({
left: 50, opacity: 'show'
}, 500);
一个使用“easein”函数提供不同动画样式的例子。只有使用了插件来提供这个“easein”函数,这个参数才起作用。
$("p").animate({
opacity: 'show'
}, "slow", "easein");
标签:jquery
您可能感兴趣
- jquery的动画效果api(jQuery框架实现元素显示及隐藏三种动画方式)
- jquery中text(),val(),html()区别
- jquery unbind
- jquery中append和appendto的区别
- jquery实现标签输入功能
- jquery 淡入淡出
- jQuery end()
- jquery next()
- jquery左右选择框
- jquery deferred对象
- jquery中change()
- jquery留言板代码(JavaScript实现留言板添加删除留言)
- jquery鼠标滑过显示提示框
- jQuery实现tab切换
- jQuery如何跳出each循环
- jquery导航栏动画(jQuery实现带展开动画的导航栏效果)
- 下雪会怎样(下雪怎样画)
- 白蓝色穿搭(白蓝色衣服配什么裤子)
- 天空是什么颜色(天空是什么颜色的英语)
- 高马尾扎发(高马尾扎发教程视频)
- 这里输入关键词(请手动输入关键词)
- 小说 顾瑾岚拿出一套飞行棋,别说你连飞行棋都不会哦(顾瑾岚拿出一套飞行棋)
热门推荐
- asp.net小数点四舍五入
- 微信小程序scrollview 截图(微信小程序scroll-view不能左右滑动问题的解决方法)
- SQL中的ISNULL的用法
- docker装redis(通过Docker部署Redis 6.x集群的方法)
- mysql的存储性能优化(MySQL的查询缓存和Buffer Pool)
- markdown和python的关系(解决python Markdown模块乱码的问题)
- serv-u怎么用web登录(serv-u服务器的管理方法与功能分析)
- linux安装deb包命令(Linux deb包解压、修改等操作方法代码示例)
- dedecms授权付费(dedecms实现删除垃圾会员的方法)
- sql的select语句用法(SQL update select结合语句详解及应用)