Q.ヘッダーコンテンツのキャッチフレーズ、説明文、ボタン、画像などに適用されるアニメーション(フェードイン、スライド1、スライド2)の速度を変更することは可能でしょうか?
A.下記にてご対応ください。
外観>TCDテーマオプション>基本設定のカスタムCSSに下記を入力して下さい。
.p-index-slider__item.is-active .p-index-slider__item-catch, .p-index-slider__item.is-active .p-index-slider__item-desc, .p-index-slider__item.is-active .p-index-slider__item-image { transition: 3s; } .p-index-slider__item.is-active .p-index-slider__item-button { transition-duration: 2s; } .p-index-slider__item.is-active .p-index-slider__item-catch, .p-index-slider__item.is-active .p-index-slider__item-desc { transition-delay: 3.5s; } .p-index-slider__item.is-active .p-index-slider__item-image { transition-delay: 2s; }
補足)○s部分を上から 1~4 とし、各数値について説明します。
1:各要素が出現(透明から不透明になる)するまでの時間
2:ボタンが出現(透明から不透明になる)するまでの時間
3:スライダーが切り替わってからキャッチフレーズ・説明文が出現するまでの時間
4:スライダーが切り替わってから画像が出現するまでの時間
3と4の数値を同じにすると、コンテンツが同時に出現します。
この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!