Skip to content

Commit a5909db

Browse files
crisbetojelbourn
authored andcommitted
fix(select): animation jumping on IE11 (#10050)
Fixes the select animation looking off in IE11 by starting from the end, before resetting to the beginning and animating again. Seems to be due to the fact that we haven't defined the initial state, but we were setting it as a keyframe in the animation.
1 parent 2fad732 commit a5909db

File tree

1 file changed

+5
-5
lines changed

1 file changed

+5
-5
lines changed

src/lib/select/select-animations.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,11 @@ export const matSelectAnimations: {
3838
* When the panel is removed from the DOM, it simply fades out linearly.
3939
*/
4040
transformPanel: trigger('transformPanel', [
41+
state('void', style({
42+
transform: 'scaleY(0)',
43+
minWidth: '100%',
44+
opacity: 0
45+
})),
4146
state('showing', style({
4247
opacity: 1,
4348
minWidth: 'calc(100% + 32px)', // 32px = 2 * 16px padding
@@ -50,11 +55,6 @@ export const matSelectAnimations: {
5055
})),
5156
transition('void => *', group([
5257
query('@fadeInContent', animateChild()),
53-
style({
54-
opacity: 0,
55-
minWidth: '100%',
56-
transform: 'scaleY(0)'
57-
}),
5858
animate('150ms cubic-bezier(0.25, 0.8, 0.25, 1)')
5959
])),
6060
transition('* => void', [

0 commit comments

Comments
 (0)