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 增加表格(jquery实现表格无缝滚动)
- jquery插件写法
- jquery左右选择框
- jquery next()
- jquery on绑定多个事件
- jquery使用data缓存数据
- jquery操作table
- html导航条下拉菜单代码(Html+Css+Jquery实现左侧滑动拉伸导航菜单栏的示例代码)
- jquery on绑定hover
- jquery导航栏动画(jQuery实现带展开动画的导航栏效果)
- jquery抛物线动画加入购物车
- jquery实现聚光灯效果
- MVC中使用jQuery加载分部视图(PartialView)
- jquery 实现对联广告
- jquery实现在光标位置插入内容
- jquery中unbind、bind
- 没钱只能吃土(没钱要吃土了幽默短信发朋友圈)
- 今年考高会很难吗(今年高考会考试吗)
- 盘古开天地 他创造了世界,谁创造了盘古 盘古是伏羲吗(盘古开天地他创造了世界)
- 关于队徽 你了解这些么 二(关于队徽你了解这些么)
- 冬天来了手脚冰凉 真不是因为上辈子你是折翼的天使(冬天来了手脚冰凉)
- 0 1 岁婴儿最强作息指南,照着做养出天使宝宝(01岁婴儿最强作息指南)
热门推荐
- html使用canvas画矩形(CSS、SVG和canvas分别实现文本文字纹理叠加效果)
- mysql如何删除外键约束数据(MySQL中外键的创建、约束以及删除)
- python time模块记录时间(Python Datetime模块和Calendar模块用法实例分析)
- docker容器技术搭建个人博客(使用Portainer部署Docker容器的项目实践)
- php获取网页内容的几种方法(PHP实现的文件浏览器功能简单示例)
- python图书管理系统(python面向对象法实现图书管理系统)
- php列表怎么用(PHP开启目录引索+fancyindex漂亮目录浏览带搜索功能)
- js实现图片旋转
- ASP.NET私有构造函数作用
- jQuery判断对象是否存在