third_party/WebKit/LayoutTests/animations/interpolation/object-position-interpolation.html - Issue 1690543002: Add additive animation support for CSS properties perspective-origin and object-position

Side by Side Diff

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Keyboard Shortcuts

	File
u :	up to issue
j / k :	jump to file after / before current file
J / K :	jump to next file with a comment after / before current file
	Side-by-side diff
i :	toggle intra-line diffs
e :	expand all comments
c :	collapse all comments
s :	toggle showing all comments
n / p :	next / previous diff chunk or comment
N / P :	next / previous comment
<Up> / <Down> :	next / previous line

	Issue
u :	up to list of issues
j / k :	jump to patch after / before current patch
o / <Enter> :	open current patch in side-by-side view
i :	open current patch in unified diff view

	Issue List
j / k :	jump to issue after / before current issue
o / <Enter> :	open current issue

Side by Side Diff: third_party/WebKit/LayoutTests/animations/interpolation/object-position-interpolation.html

Issue 1690543002: Add additive animation support for CSS properties perspective-origin and object-position (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@_backgroundPositionAnimation

Patch Set: Rebased Created 4 years, 10 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« no previous file with comments | « third_party/WebKit/LayoutTests/animations/composition/perspective-origin-composition.html ('k') | third_party/WebKit/Source/core/animation/CSSLengthInterpolationType.h » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <meta charset="UTF-8">	2 <meta charset="UTF-8">

3 <style>	3 <style>

4 .parent {	4 .parent {

5 object-position: 30px 10px;	5 object-position: 30px 10px;

6 }	6 }

7 .target {	7 .target {

8 position: relative;	8 position: relative;

9 width: 100px;	9 width: 100px;

10 height: 100px;	10 height: 100px;

(...skipping 115 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
126 {at: -0.3, is: '35% 65%'},	126 {at: -0.3, is: '35% 65%'},

127 {at: 0, is: '50% 50%'},	127 {at: 0, is: '50% 50%'},

128 {at: 0.5, is: '75% 25%'},	128 {at: 0.5, is: '75% 25%'},

129 {at: 1, is: '100% 0%'},	129 {at: 1, is: '100% 0%'},

130 {at: 1.5, is: '125% -25%'}	130 {at: 1.5, is: '125% -25%'}

131 ]);	131 ]);

132	132

133 assertInterpolation({	133 assertInterpolation({

134 property: 'object-position',	134 property: 'object-position',

135 from: 'center',	135 from: 'center',

136 to: 'right bottom 100%',	136 to: 'right bottom 50%',

137 }, [	137 }, [

138 {at: -0.5, is: '25% 75%'},	138 {at: -0.5, is: '25% 50%'},

139 {at: 0, is: 'center'},	139 {at: 0, is: 'center'},

140 {at: 0.3, is: '65% 35%'},	140 {at: 0.3, is: '65% 50%'},

141 {at: 0.5, is: '75% 25%'},	141 {at: 0.5, is: '75% 50%'},

142 {at: 0.9, is: '95% 5%'},	142 {at: 0.9, is: '95% 50%'},

143 {at: 1, is: 'right bottom 100%'},	143 {at: 1, is: '100% 50%'},

144 {at: 1.5, is: '125% -25%'},	144 {at: 1.5, is: '125% 50%'},

145 {at: 2, is: '150% -50%'},	145 {at: 2, is: '150% 50%'},

146 ]);	146 ]);

147 </script>	147 </script>

148 </body>	148 </body>

OLD	NEW