From f34dda0ef271a8435891670965ec7c1c7a622ee9 Mon Sep 17 00:00:00 2001 From: KatakuraNatsumi Date: Wed, 5 May 2021 23:54:35 +0900 Subject: [PATCH] chore: fix transitions-overview translations to be up to date --- src/guide/transitions-overview.md | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/src/guide/transitions-overview.md b/src/guide/transitions-overview.md index 0ffca49d..7e7ab244 100644 --- a/src/guide/transitions-overview.md +++ b/src/guide/transitions-overview.md @@ -1,7 +1,6 @@ # 概要 -Vue は何らかの変化に応じてトランジションやアニメーションを付けるのに役立つ、いくつかの抽象化を提供します。 - これらの抽象化には、次のものが含まれます: +Vue は何らかの変化に応じてトランジションやアニメーションを付けるのに役立つ、いくつかの抽象化を提供します。これらの抽象化には、次のものが含まれます: - 組み込みコンポーネントの `` を使用して、CSS と JS の両方で DOM に出入りするコンポーネントをフックします。 - トランジションの途中の順序を調整できるようにトランジションモードがあります。 @@ -73,9 +72,9 @@ Vue.createApp(Demo).mount('#demo') -# スタイルバインディングによるトランジション +## スタイルバインディングによるトランジション -一部のトランジションによるエフェクトは補間値を適用できます。たとえば、トランジションの発生中に要素にスタイルをバインドすることによって適用できます。 例を見てみましょう: +一部のトランジションによる効果は補間値を適用できます。たとえば、トランジションの発生中に要素にスタイルをバインドすることによって適用できます。 例を見てみましょう: ```html
@@ -166,7 +165,7 @@ GreenSock のような多くの JS ライブラリは、ハードウェアアク .button:hover { background: #3eaf7c; - /* applied to the hover state, so this trnaisition will be applied when a hover is triggered */ + /* applied to the hover state, so this transition will be applied when a hover is triggered */ transition: background 0.35s ease-out; } ``` @@ -175,7 +174,7 @@ GreenSock のような多くの JS ライブラリは、ハードウェアアク イージングはアニメーション化されている素材の品質を伝えることもできます。 この CodePen を例にとると、どちらのボールが硬く、どちらのボールが柔らかいと思いますか？ - + イージングを調整することで多くのユニークな効果を得ることができ、アニメーションを非常にスタイリッシュにすることができます。CSS を使用すると、3次のベジェ曲線のプロパティを調整して変形できます。 Lea Verou 氏によって作成された [Playground](https://cubic-bezier.com/#.17,.67,.83,.67) は、イージングを探索するのに非常に役立ちます。