Jquery动画动画效果：

密码

！doctype html lang=' en ' head meta charset=' utf-8 '标题动画/标题样式* { margin:0划水：0；} .box { width: 400pxheight: 300px背景技术： # 000；margin:40px汽车；color: # ffffont-size : 18px；文本对齐：中心；} /style script //获取对象样式规则信息，并使用当前样式函数getstyle (obj，style) {return obj.currentstyle？obj . current style[style]: getcomputed style(obj，false)[style]；}//原生js动画类似于jquery-animate函数animate (obj，style JSON，callback){ clear interval(obj . timer)；//启动计时器obj。timer=set interval(function(){ varflag=true；//假设所有操作都已完成。For(样式JSON中的var样式名){//1。取当前属性值var iMov=0；//透明度是十进制的，所以要单独处理iMov=styleName=='不透明度'？math . round(parseFloat(getStyle(obj，style name))* 100): parseint(getStyle(obj，style name))；//2.计算速度var速度=0；速度=(style JSON[style name]-iMov)/8；//缓冲区处理，这也可以是固定值speed=speed0？Math.ceil(速度): path . floor(速度)；//区分透明度和小数点，向上舍入和向下舍入。//3.判断是否达到预设值if(styleJson[styleName]！=IMov){ flag=false；If(styleName=='不透明度'){//确定结果是否为透明对象。style[style name]=(imovspeed)/100；obj . style . filter=' alpha(opa city 3360 '(iMov speed)')'；} else { obj . style[style name]=IMov speed ' px '；}}}如果(flag){//达到设定值，停止定时器，执行回调clearInterval(obj . timer)；if(回调){ callback()；} } }，30)} window . onload=function(){ document . getelementbyid(' box ')。onclick=function(){ var Othis=this；Animate (othis，{'width' :' 500'}，function () {animate (othis，{'height' :' 400'}，function () {alert ('width和height都增加了')})；});} }/script/head body div class=' box ' id=' box '点击效果：宽度增加-高度增加-弹出框/div/body/html注：1。动画前停止原定时器，否则绑定多个对象会冲突；2.应该区分定时器的id，并且不能重叠。这里，我直接将obj.timer3分配给绑定对象的对象。3.判断要执行的动画是否达到设定值=flag，然后停止定时器，再执行回调函数。4.javascript数据类型转换问题预警(0.07 * 100)；//弹出7.000000000000000001。注意：Javascript在存储时不区分数字和浮点数类型，而是通过浮点数统一存储。Javascript使用IEEE 754-2008定义的64位浮点格式来存储数字。根据IEEE 754，十进制64对应的整形部分长度为10，小数部分长度为16，所以默认计算结果为“7.0000000000000000000000000000000000000000000000000000000000000000000000000000如果最后一位小数为0，则1作为有效数字标记。5.传入的json数据不能取px，例如{'width' :' 300 PX'}。为了兼容透明度值，没想到有好的处理方法。你有大神的指引吗.6.计时器被缓冲，变化越来越慢。如果你想要一个快速的效果或者一个均匀的效果，你只需要在块2中进行处理。计算速度。7.与CS不兼容。仅兼容(宽度、高度、顶部、左侧、右侧、底部、不透明度)8。获取对象风格的信息，判断IE或者火狐浏览器，区别对待

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。