| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <title>Tween.js / hello world!</title> |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
| <link href="css/style.css" media="screen" rel="stylesheet" type="text/css" /> |
| </head> |
| <body> |
| <div id="info"> |
| <h1><a href="http://github.com/tweenjs/tween.js">tween.js</a></h1> |
| <h2>00 _ hello world</h2> |
| <p>Simple example for illustrating the creation and chaining of tweens.</p> |
| </div> |
| <div id="target" style="position:absolute; top: 100px; left: 100px; width: 100px; height: 100px; background: #a0dde9; padding: 1em;"> |
| hello world! |
| </div> |
|
|
| <script src="../src/Tween.js"></script> |
| <script src="js/RequestAnimationFrame.js"></script> |
| |
| <script src="additionWithStart.js"></script> |
| <script src="additionWithoutStart.js"></script> |
| <script src="additionWithUpdate.js"></script> |
| <script src="updateMany.js"></script> |
| |
| <script> |
| |
| function timeFunction(func) { |
| var startTime = new Date().getTime(); |
| func(); |
| var endTime = new Date().getTime(); |
| |
| return (endTime - startTime) / 1000.0; |
| } |
| |
| var additionWithStartTime = timeFunction(additionWithStart); |
| TWEEN.removeAll(); |
| console.log("Addition with start(): " + additionWithStartTime); |
| |
| var additionWithoutStartTime = timeFunction(additionWithoutStart); |
| TWEEN.removeAll(); |
| console.log("Addition without start(): " + additionWithoutStartTime); |
| |
| var additionWithUpdateTime = timeFunction(additionWithUpdate); |
| TWEEN.removeAll(); |
| console.log("Addition with TWEEN.update(): " + additionWithUpdateTime); |
| |
| updateManySetup(); |
| var updateManyTime = timeFunction(updateMany); |
| TWEEN.removeAll(); |
| console.log("Update many tweens: " + updateManyTime); |
| |
| </script> |
| </body> |
| </html> |
|
|
