标签：
14、totalDuration():获取动画的总时长
Demo:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="js/TweenMax.min.js"></script> <title>无标题文档</title> <style type="text/css"> *{ padding:0; margin:0;} #div1{ width:100px; height:100px; background:red; margin:6px 0; position:absolute; left:0; top:0;} </style> <script> $(function(){ var t=new TimelineMax(); t.to(‘#div1‘,1,{left:300},4); t.to(‘#div1‘,2,{width:300},‘+=1‘); t.to(‘#div1‘,3,{height:300}); alert(t.totalDuration()); }) </script> </head> <body> <div id="div1"></div> </body> </html>
15、getLabelTime():返回从开始到当前状态的时间
参数说明：1、状态的字符串 返回值是一个数字
Demo:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="js/TweenMax.min.js"></script> <title>无标题文档</title> <style type="text/css"> *{ padding:0; margin:0;} #div1{ width:100px; height:100px; background:red; margin:6px 0; position:absolute; left:0; top:0;} </style> <script> $(function(){ var t=new TimelineMax(); t.add("state1"); t.to(‘#div1‘,1,{left:300}); t.to(‘#div1‘,2,{width:300}); t.add("state2"); t.to(‘#div1‘,3,{height:300}); t.add("state3"); alert(t.getLabelTime("state3")); }) </script> </head> <body> <div id="div1"></div> </body> </html>
16、currentLable():获取当前状态 返回值是状态的字符串
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="js/TweenMax.min.js"></script> <title>无标题文档</title> <style type="text/css"> *{ padding:0; margin:0;} #div1{ width:100px; height:100px; background:red; margin:6px 0; position:absolute; left:0; top:0;} </style> <script> $(function(){ var t=new TimelineMax(); t.add("state1"); t.to(‘#div1‘,1,{left:300}); t.to(‘#div1‘,2,{width:300,onComplete:function(){getCurrentLabel();}}); t.add("state2"); t.to(‘#div1‘,3,{height:300,onComplete:function(){getCurrentLabel();}}); t.add("state3"); //alert(t.getLabelTime("state3")); getCurrentLabel(); function getCurrentLabel(){ alert(t.currentLabel()); } }) </script> </head> <body> <div id="div1"></div> </body> </html>
解释说明：getLabelTime()和currentLable()结合使用
获取当前状态开始到结束所使用的时间,demo见以下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="js/TweenMax.min.js"></script> <title>无标题文档</title> <style type="text/css"> *{ padding:0; margin:0;} #div1{ width:100px; height:100px; background:red; margin:6px 0; position:absolute; left:0; top:0;} </style> <script> $(function(){ var t=new TimelineMax(); t.add("state1"); t.to(‘#div1‘,1,{left:300}); t.to(‘#div1‘,2,{width:300,onComplete:function(){getCurrentLabel();}}); t.add("state2"); t.to(‘#div1‘,3,{height:300,onComplete:function(){getCurrentLabel();}}); t.add("state3"); //alert(t.getLabelTime("state3")); getCurrentLabel(); function getCurrentLabel(){ alert(t.getLabelTime(t.currentLabel())); } }) </script> </head> <body> <div id="div1"></div> </body> </html>
标签：
原文地址：http://www.cnblogs.com/cacti/p/5064024.html
