WordPressテーマTCDのカスタマイズを研究するサイト

TCDテーマOOPS!:ヘッダーコンテンツ画像スライダーのアニメーション表示速度を変更する方法

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の数値を同じにすると、コンテンツが同時に出現します。

The following two tabs change content below.

RM

一年中麦茶を飲んでいます。

TCD LABO ご利用上の注意

TCD LABO(ティーシーディー・ラボ)に掲載しているTCDテーマのカスタマイズ情報のご利用にあたっては、必ずカスタマイズするファイルのバックアップをご用意の上、ご利用者様責任において実施していただきますようお願いいたします。

カスタマイズの実施により生じたいかなる不具合等についてもTCD LABOはその責任を負いかねます。
何卒ご理解、ご了承の上、当サイトをご活用いただけますようお願い申し上げます。

お問合せ・ご要望

TCDLaboへのお問合せやご要望は
ご連絡フォーム をご利用ください。