Editor X：プリセット操作を追加する | サポートセンター

Editor X：プリセット操作を追加する

読了時間：6分

Editor X は、代理店とフリーランサー向けの新しいプラットフォームである Wix Studio に移行します。Wix Studio について

要素設定パネルの「操作」タブでトリガーを選択し、訪問者がクリックまたはマウスオーバーした際に、要素がアニメーション化されるようにします。要素を簡単にアニメーション化したい場合は、プリセットから「拡大」、「ムーブ」、「フェード」などを選択し、好みに合わせて調整することができます。

アニメーション化する要素には、訪問者がクリックやマウスオーバーする要素だけでなく、ページ上の別の要素を選択することもできます。いずれの場合も、外観やタイミングなどを細かく制御できるため、ライブサイトに効果的なエフェクトを追加することができます。

はじめに、要素を選択して、アニメーションが実行されるトリガーを選択します。これにより、その要素がクリックまたはマウスオーバーのどちらの条件でアニメーション化されるかが決まります。

ヒント：

要素に複数の操作を追加して、ホバーまたはクリックで異なるアニメーションをトリガーすることもできます。

要素とトリガーを選択したら、その要素がトリガーされた際のアニメーションを設定します。クリック時またはマウスオーバー時のアニメーションの挙動を選択し、アニメーションが適用される要素を選択して、プリセットからアニメーションを選択します。

注意：

利用可能なアニメーションは、選択した要素によって異なります。

（操作設定パネルで）「ホバー時」と「クリック時」時の動作を選択します：
- アニメーションを開始：要素をクリックまたはマウスオーバーすると、選択したアニメーションが開始されます。
- アニメーションをリセット：要素をクリックまたはマウスオーバーすると、適用されていたアニメーションがリセットされます。
- トグルのオン / オフ：要素をクリックするとアニメーションが有効となり、もう一度クリックするとアニメーションが無効となります。
  注意：このオプションは、クリック操作でのみ使用できます。
「アニメーション要素」を選択します：
- 選択した要素自体にアニメーションを適用する：要素名をクリックします（選択した要素名の横に「（同パーツ）」と表示されます）。
- ページ上の別の要素にアニメーションを適用する：ドロップダウンから要素を選択するか、「キャンバスで選択」をクリックしてページ上から選択します。
  ヒント：「Cmd」または「Ctrl」キーを押しながら子要素を選択します。
アニメーションを選択します：
1. 「プリセット」タブをクリックします。
2. リストからアニメーションを選択します。

ヒント：

クリックまたはホバーで表示する要素を設定すると、キャンバス上に市松模様のオーバーレイで表示されます。これは、要素が最初は透明であることを示します。

この表示はいつでもオフにすることができます。トップバーの「表示」をクリックし、「透明な要素」をクリックします。

アニメーションを設定したら、必要に応じてその動作をカスタマイズします。「遅延時間」、「所要時間」、「イージング」などの設定を調整して、効果的なアニメーションに仕上げることができます。