javascript 45种缓动效果 非常酷


Posted in Javascript onJune 28, 2011

ble class="3waterborder" style="FONT-SIZE: 12px" cellspacing="0" cellpadding="0" border="1"> 参数 类型 说明 el element 必需,为页面元素 begin number 必需,开始的位置 change number 必需,要移动的距离 duration number 可选,缓动效果持续时间,默认是500ms。建议取300~1000ms。 field string 必需,要发生变化的样式属性。请在top,left,bottom,right,width与height中选择。 ftp number 可选,每秒进行多少帧动画,默认50帧,保证流畅播放。一些参考资料,日本动画1秒36帧,中国卡通24帧,赛车游戏60帧。 ease function 必需,缓动公式,参数为0~1之间的数。可参考我下面给出的45条公式。 onStart function 可选,在开始时执行。 onEnd function 可选,在结束时执行。 prototype流派的缓动公式,只需一个参数(增至45种)

'; }).join('') + '
' +'
'; demo.innerHTML = grid + graph; var indicator = _("indicator"), marker = _("marker"), label = _("label"), demoTransition = function(pos){ var value = tween[ease](pos); indicator.style.display = "block"; marker.style.display = "block"; marker.style.left = Math.round(pos*200)+'px'; marker.style.bottom = Math.round((value*200-min)*factor)+'px'; label.innerHTML = Math.round(pos*200)+'px'; return value; } transition(indicator,{field:"left",begin:parseFloat(getCoords(demo).left),change:200, ease:demoTransition}) } window.onload = function(){ var panelHTML = function(){ var builder = []; var _temp = 'Back Circ Cubic Expo Quad Quart Quint Sine'.split(' '); var ease = _temp.map(function(v){ return 'easeIn'+v; }); ease = ease.concat(_temp.map(function(v){ return 'easeOut'+v; })); ease = ease.concat(_temp.map(function(v){ return 'easeInOut'+v; })); ease = ease.concat('blink bounce bouncePast easeFrom easeFromTo easeOutBounce easeTo elastic'.split(' ')); ease = ease.concat('flicker full linear mirror none pulse reverse sinusoidal spring swingTo swingFrom swingFromTo wobble'.split(' ')) for(var i =0,l=ease.length;i"); builder.push(ease[i]); builder.push("

Javascript 相关文章推荐
发一个自己用JS写的实用看图工具实现代码
Jul 26 Javascript
函数式 JavaScript(一)简介
Jul 07 Javascript
深入理解JavaScript系列(18):面向对象编程之ECMAScript实现
Mar 05 Javascript
javascript页面倒计时实例
Jul 25 Javascript
BootStrap selectpicker
Jun 20 Javascript
利用css+原生js制作简单的钟表
Apr 07 Javascript
JavaScript中ES6 Babel正确安装过程
Jul 18 Javascript
JS+CSS实现下拉刷新/上拉加载插件
Mar 31 Javascript
jQuery Validate表单验证插件实现代码
Jun 08 jQuery
js+html5生成自动排列对话框实例
Oct 09 Javascript
JS实现统计字符串中字符出现个数及最大个数功能示例
Jun 04 Javascript
详细聊聊vue中组件的props属性
Nov 02 Vue.js
JQuery中对服务器控件 DropdownList, RadioButtonList, CheckboxList的操作总结
Jun 28 #Javascript
关于js类的定义
Jun 28 #Javascript
js 编程笔记 无名函数
Jun 28 #Javascript
jQuery效果 slideToggle() 方法(在隐藏和显示之间切换)
Jun 28 #Javascript
基于jquery的回到页面顶部按钮
Jun 27 #Javascript
jQuery新闻滚动插件 jquery.roller.js
Jun 27 #Javascript
jquery中获取select选中值的代码
Jun 27 #Javascript
You might like
解析左右值无限分类的实现算法
2013/06/20 PHP
php获取新浪微博数据API实例
2013/11/12 PHP
discuz免激活同步登入代码修改方法(discuz同步登录)
2013/12/24 PHP
PHP实现将几张照片拼接到一起的合成图片功能【便于整体打印输出】
2017/11/14 PHP
thinkphp5 URL和路由的功能详解与实例
2017/12/26 PHP
PHP类与对象后期静态绑定操作实例详解
2018/12/20 PHP
jQuery get和post 方法传值注意事项
2009/11/03 Javascript
在Javascript中 声明时用"var"与不用"var"的区别
2013/04/15 Javascript
Bootstrap Table使用方法解析
2016/10/19 Javascript
BootStrap Table后台分页时前台删除最后一页所有数据refresh刷新后无数据问题
2016/12/28 Javascript
JavaScript实现简单图片轮播效果
2017/08/21 Javascript
vue2.x select2 指令封装详解
2017/10/12 Javascript
微信小程序基于slider组件动态修改标签透明度的方法示例
2017/12/04 Javascript
详解微信小程序开发聊天室—实时聊天,支持图片预览
2019/05/20 Javascript
layui的表单验证支持ajax判断用户名是否重复的实例
2019/09/06 Javascript
js实现漂亮的星空背景
2019/11/01 Javascript
webpack常用配置总览(小结)
2019/11/18 Javascript
基于JS实现视频上传显示进度条
2020/05/12 Javascript
Vue + Element-ui的下拉框el-select获取额外参数详解
2020/08/14 Javascript
python使用urlparse分析网址中域名的方法
2015/04/15 Python
python多进程共享变量
2016/04/06 Python
Python多线程经典问题之乘客做公交车算法实例
2017/03/22 Python
Python基于whois模块简单识别网站域名及所有者的方法
2018/04/23 Python
Python中format()格式输出全解
2019/04/12 Python
python flask解析json数据不完整的解决方法
2019/05/26 Python
关于keras中keras.layers.merge的用法说明
2020/05/23 Python
使用SQLAlchemy操作数据库表过程解析
2020/06/10 Python
python 读txt文件,按‘,’分割每行数据操作
2020/07/05 Python
Python基础教程之输入输出和运算符
2020/07/26 Python
Python 使用双重循环打印图形菱形操作
2020/08/09 Python
python中使用np.delete()的实例方法
2021/02/01 Python
解决pycharm 格式报错tabs和space不一致问题
2021/02/26 Python
canvas进阶之贝塞尔公式推导与物体跟随复杂曲线的轨迹运动
2018/01/10 HTML / CSS
中学劳技课教师的自我评价
2014/02/05 职场文书
《散步》教学反思
2014/03/02 职场文书
校园运动会广播稿
2014/10/06 职场文书