Optimize animations and transitions
will-change is apparently not enough to run GPU-enabled animations, use translateZ on top of it
This commit is contained in:
@@ -15,7 +15,8 @@ export const animateIn = () => {
|
||||
// Title: Houses
|
||||
tl.add({
|
||||
targets: '.place__title_houses',
|
||||
translateY: ['150%', 0]
|
||||
translateY: ['150%', 0],
|
||||
translateZ: [0, 0]
|
||||
})
|
||||
// Title: Of
|
||||
tl.add({
|
||||
@@ -25,7 +26,8 @@ export const animateIn = () => {
|
||||
// Title: Place name
|
||||
tl.add({
|
||||
targets: '.place__title_name',
|
||||
translateY: ['150%', 0]
|
||||
translateY: ['150%', 0],
|
||||
translateZ: [0, 0]
|
||||
}, 150)
|
||||
|
||||
// Switcher link
|
||||
@@ -46,6 +48,7 @@ export const animateIn = () => {
|
||||
tl.add({
|
||||
targets: '.place__description',
|
||||
opacity: [0, 1],
|
||||
translateY: [24, 0]
|
||||
translateY: [24, 0],
|
||||
translateZ: [0, 0]
|
||||
}, 450)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user