Index: polymer_0.5.0/bower_components/web-animations-js/test/blink/interpolation/z-index-interpolation.html |
diff --git a/polymer_0.5.0/bower_components/web-animations-js/test/blink/interpolation/z-index-interpolation.html b/polymer_0.5.0/bower_components/web-animations-js/test/blink/interpolation/z-index-interpolation.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..663182a466ce5b897ead3beaf8af8ba632b3a1db |
--- /dev/null |
+++ b/polymer_0.5.0/bower_components/web-animations-js/test/blink/interpolation/z-index-interpolation.html |
@@ -0,0 +1,68 @@ |
+<!DOCTYPE html> |
+<meta charset="UTF-8"> |
+<style> |
+.layer-reference { |
+ position: absolute; |
+ height: 300px; |
+ width: 50px; |
+ background-color: lightgrey; |
+ font-family: sans-serif; |
+ text-align: center; |
+ padding-top: 5px; |
+ border: 1px solid; |
+} |
+.target { |
+ position: absolute; |
+ width: 450px; |
+ height: 10px; |
+} |
+.active { |
+ background-color: black; |
+} |
+.replica { |
+ background-color: green; |
+} |
+.spacer { |
+ height: 350px; |
+} |
+</style> |
+<body> |
+ |
+<div class="spacer"></div> |
+ |
+<script src="../testharness/testharness.js"></script> |
+<script src="../testharness/testharnessreport.js"></script> |
+<script src="resources/interpolation-test.js"></script> |
+<script> |
+ |
+[-8, -5, -2, 1, 5, 10, 12].forEach(function(zIndex, i) { |
+ var layerReference = document.createElement('div'); |
+ layerReference.classList.add('layer-reference'); |
+ layerReference.style.zIndex = zIndex; |
+ layerReference.style.top = '0px'; |
+ layerReference.style.left = 50 + (i * 50) + 'px'; |
+ layerReference.textContent = 'Z ' + zIndex; |
+ document.body.appendChild(layerReference); |
+}); |
+assertInterpolation({ |
+ property: 'z-index', |
+ from: '-5', |
+ to: '5' |
+}, [ |
+ {at: -0.3, is: '-8'}, |
+ {at: 0, is: '-5'}, |
+ {at: 0.3, is: '-2'}, |
+ {at: 0.6, is: '1'}, |
+ {at: 1, is: '5'}, |
+ {at: 1.5, is: '10'}, |
+]); |
+afterTest(function() { |
+ var actives = document.querySelectorAll('.active'); |
+ var replicas = document.querySelectorAll('.replica'); |
+ for (var i = 0; i < actives.length; i++) { |
+ actives[i].style.top = 50 + (i * 40) + 'px'; |
+ replicas[i].style.top = 60 + (i * 40) + 'px'; |
+ } |
+}); |
+</script> |
+</body> |