Index: third_party/WebKit/ManualTests/animation/compositor-transform-fill-forwards-with-motion-path.html |
diff --git a/third_party/WebKit/ManualTests/animation/compositor-transform-fill-forwards-with-motion-path.html b/third_party/WebKit/ManualTests/animation/compositor-transform-fill-forwards-with-motion-path.html |
index 3710020143097d4e89b11650f24e6718fd0a8a15..3aad5968db51cb782d4f55974af1bb5967185996 100644 |
--- a/third_party/WebKit/ManualTests/animation/compositor-transform-fill-forwards-with-motion-path.html |
+++ b/third_party/WebKit/ManualTests/animation/compositor-transform-fill-forwards-with-motion-path.html |
@@ -15,12 +15,14 @@ div { |
left: 100px; |
top: 200px; |
offset-path: path('m 0 0 h 400'); |
+ transform-origin: 0px 0px; |
} |
#div2 { |
z-index: 3; |
left: 100px; |
top: 300px; |
+ transform-origin: 0px 0px; |
} |
</style> |
@@ -40,8 +42,8 @@ var div2 = document.getElementById('div2'); |
function startAnimations() { |
div1.animate([ |
- {motionOffset: '0%'}, |
- {motionOffset: '100%'} |
+ {offsetDistance: '0%'}, |
+ {offsetDistance: '100%'} |
], { |
duration: 1000, |
delay: 1000, |
@@ -65,11 +67,11 @@ function startAnimations() { |
fill: 'forwards' |
}); |
setTimeout(function() { |
- div2.style.motionPath = 'path("m 0 0 h -400")'; |
- div2.style.motionRotation = '0deg'; |
+ div2.style.offsetPath = 'path("m 0 0 h -400")'; |
+ div2.style.offsetRotate = '0deg'; |
div2.animate([ |
- {motionOffset: '0%'}, |
- {motionOffset: '100%'} |
+ {offsetDistance: '0%'}, |
+ {offsetDistance: '100%'} |
], { |
duration: 1000, |
fill: 'forwards' |