Skip to content

Commit dc0cd37

Browse files
committed
docs: translate Customizing animations
1 parent b507955 commit dc0cd37

File tree

1 file changed

+8
-6
lines changed

1 file changed

+8
-6
lines changed

src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2483,19 +2483,21 @@ In practice, navigations should be done via "enter" and "exit" props, or by usin
24832483

24842484
### Customizing animations {/*customizing-animations*/}
24852485

2486-
By default, `<ViewTransition>` includes the default cross-fade from the browser.
2486+
기본적으로 `<ViewTransition>`은 브라우저의 기본 크로스페이드를 포함합니다.
2487+
2488+
애니메이션을 커스터마이징하려면 [어떻게 `<ViewTransition>`이 활성화되는지](/reference/react/ViewTransition#props)에 따라 어떤 애니메이션을 사용할지 지정하는 props를 `<ViewTransition>` 컴포넌트에 제공할 수 있습니다.
2489+
2490+
예를 들어 `default` 크로스페이드 애니메이션을 느리게 만들 수 있습니다.
24872491

2488-
To customize animations, you can provide props to the `<ViewTransition>` component to specify which animations to use, based on [how the `<ViewTransition>` activates](/reference/react/ViewTransition#props).
24892492

2490-
For example, we can slow down the `default` cross fade animation:
24912493

24922494
```js
24932495
<ViewTransition default="slow-fade">
24942496
<Home />
24952497
</ViewTransition>
24962498
```
24972499

2498-
And define `slow-fade` in CSS using [view transition classes](/reference/react/ViewTransition#view-transition-classes):
2500+
그리고 [뷰 전환 클래스](/reference/react/ViewTransition#view-transition-classes)를 사용하여 CSS에서 `slow-fade`를 정의합니다.
24992501

25002502
```css
25012503
::view-transition-old(.slow-fade) {
@@ -2507,7 +2509,7 @@ And define `slow-fade` in CSS using [view transition classes](/reference/react/V
25072509
}
25082510
```
25092511

2510-
Now, the cross fade is slower:
2512+
이제 크로스페이드가 더 느려집니다.
25112513

25122514
<Sandpack>
25132515

@@ -3686,7 +3688,7 @@ root.render(
36863688

36873689
</Sandpack>
36883690

3689-
See [Styling View Transitions](/reference/react/ViewTransition#styling-view-transitions) for a full guide on styling `<ViewTransition>`.
3691+
`<ViewTransition>` 스타일링에 대한 전체 가이드는 [View Transitions 스타일링](/reference/react/ViewTransition#styling-view-transitions)을 참조하세요.
36903692

36913693
### Shared Element Transitions {/*shared-element-transitions*/}
36923694

0 commit comments

Comments
 (0)