Index: pkg/polymer/lib/elements/web-animations-js/tutorial/sample-tutorial.html |
diff --git a/pkg/polymer/lib/elements/web-animations-js/tutorial/sample-tutorial.html b/pkg/polymer/lib/elements/web-animations-js/tutorial/sample-tutorial.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..f10ee22055130a94bf09dc019ac452a365f99ee7 |
--- /dev/null |
+++ b/pkg/polymer/lib/elements/web-animations-js/tutorial/sample-tutorial.html |
@@ -0,0 +1,44 @@ |
+<!-- |
+ Copyright 2013 Google Inc. All Rights Reserved. |
+ |
+ Licensed under the Apache License, Version 2.0 (the "License"); |
+ you may not use this file except in compliance with the License. |
+ You may obtain a copy of the License at |
+ |
+ http://www.apache.org/licenses/LICENSE-2.0 |
+ |
+ Unless required by applicable law or agreed to in writing, software |
+ distributed under the License is distributed on an "AS IS" BASIS, |
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
+ See the License for the specific language governing permissions and |
+ limitations under the License. |
+--> |
+ |
+<body onload="myDisplay.update()"> |
+ <div id="myDisplayDiv"></div> |
+ <script type="text/javascript" src="try-it-yourself.js"></script> |
+ <script type="text/javascript" src='tutorial-testing.js'></script> |
+ <script type="text/javascript" src='../web-animations.js'></script> |
+ <script type="text/javascript" src='../test/extra-asserts.js'></script> |
+ <link type="text/css" href="../animation-test-style.css"> |
+ <link rel="stylesheet" type="text/css" href="tutorial-style.css"> |
+ <script> |
+ "use strict"; |
+ |
+ var myDisplay = new TryItDisplay(document.getElementById("myDisplayDiv")); |
+ myDisplay.setDefaultHtml("<div id='a' class='test'></div>"); |
+ var css = ".test {" + |
+ "\n" + "background-color: red;" + |
+ "\n" + "border-radius: 10px;" + |
+ "\n" + "width: 100px;" + |
+ "\n" + "height: 50px;" + |
+ "\n" + "top: 50px;" + |
+ "\n" + "left: 0px;" + |
+ "\n" + "position: absolute;" + |
+ "\n" + "}"; |
+ myDisplay.setDefaultCss(css); |
+ myDisplay.setDefaultAnimationEndTime(2); |
+ myDisplay.addCheck("document.getElementById('a')", "{'left': '0px'}", 0); |
+ myDisplay.addCheck("document.getElementById('a')", "{'left': '300px'}", 2); |
+ </script> |
+</body> |