ホテル・結婚式場などのホームページがつくれるエレガントなデザインのテンプレート「CANON」

ワードプレステーマ別

TCDテーマSwitch:タイピングエフェクトの速度を変更する、エフェクトをなくす方法

WordPressテーマ「NULL」

TCD LABOはWordPressテーマ「NULL」を使用して作られています。

ダウンロード

Q.トップページのスライダー上、下層ページのヘッダー画像上のキャッチフレーズのタイピングエフェクトの速度を変更したい。エフェクト自体をなくしたい。

A.下記の方法でご対応ください。

1. スピードを調節したい

▼編集するファイルと変更箇所
トップページ: front-page.min.js (assets/js/front-page.min.js)

var t=e(".p-header-content__title span"),a={speed:150,

下層ページ: functions.min.js (assets/js/functions.min.js)

e("#js-page-header__desc span").t({speed:150,

・speed:150の数値を変更ください。
・変更内容が反映されない場合はスーパーリロードをお試し下さい。

2. エフェクトをなくしたい
※カスタマイズに関する注意事項

【テーマアップデートで対象ファイルが修正された場合、
記事と同じカスタマイズ内容では反映されなくなる可能性があります。】

 
以下の編集内容のご案内では、minify化前のファイル(assets/js/front-page.jsまたは~functions.js)の該当記述を削除し、再度minify化した記述をご案内しております。
 
テーマアップデートで対象ファイルに変更があった場合、その変更内容はこの記事には含まれておりません。ご注意ください。

▼編集するファイルと変更箇所(全ての記述をコピーペーストしてください。)
トップページ: front-page.min.js (assets/js/front-page.min.js)

"use strict";(function(e){if(e("#js-header-slider").length){var g=e("#js-header-slider");var d=g.find(".p-header-slider__item");var f=g.find(".p-header-slider__item-img");var c=g.data("speed");e(window).on("js-initialized",function(){d.first().addClass("is-active");g.slick({autoplay:true,speed:1000,autoplaySpeed:c,pauseOnHover:false});g.on("beforeChange",function(i,h,k,j){d.eq(j).delay(1000).queue(function(l){e(this).addClass("is-active");l()})});g.on("afterChange",function(j,i,k){var h=k===0?d.length-1:k-1;d.eq(h).removeClass("is-active")})})}else{}var b=document.getElementById("js-index-content01__link");var a=document.getElementById("js-cb");b.addEventListener("click",function(){e("body, html").animate({scrollTop:a.offsetTop})})})(jQuery);

下層ページ: functions.min.js (assets/js/functions.min.js)

"use strict";!function(e){var t=document.getElementById("js-header");t.classList.contains("l-header--fixed")&&window.addEventListener("scroll",function(){window.scrollY>100?t.classList.add("is-active"):t.classList.remove("is-active")});var a=document.getElementById("js-global-nav");document.getElementById("js-menu-btn").addEventListener("click",function(){e(a).slideToggle()}),a.addEventListener("click",function(t){t.target.classList.contains("p-global-nav__toggle")&&(t.preventDefault(),t.target.classList.toggle("is-active"),e(t.target.parentNode.nextElementSibling).slideToggle())});var i=document.getElementById("js-pagetop");window.addEventListener("scroll",function(){window.scrollY>100?i.classList.add("is-active"):i.classList.remove("is-active")}),i.addEventListener("click",function(){e("body, html").animate({scrollTop:0},1e3)}),e(".p-widget .searchform #searchsubmit").val(e("<div>").html("&#xe915;").text());for(var n=document.getElementsByClassName("p-dropdown__title"),s=0,l=n.length;s<l;s++)n[s].addEventListener("click",function(t){t.target.classList.toggle("is-active"),e("+ .p-dropdown__list:not(:animated)",this).slideToggle()});for(var c=document.getElementsByClassName("p-tab-panel"),o=function(e,t){c[e].querySelector(".p-tab-panel__tab-item").classList.add("is-active"),c[e].querySelector(".p-tab-panel__panel").classList.add("is-active"),c[e].addEventListener("click",function(t){t.target.getAttribute("href")&&t.target.getAttribute("href").match(/#panel\d/)&&(t.preventDefault(),t.target.parentNode.classList.contains("is-active")||(c[e].querySelector(".is-active").classList.remove("is-active"),t.target.parentNode.classList.add("is-active"),c[e].querySelectorAll(".p-tab-panel__panel").forEach(function(e){e.style.display="none"}),document.querySelector(t.target.getAttribute("href")).style.display="block"))})},d=0,r=c.length;d<r;d++)o(d);for(var g=document.querySelectorAll(".p-faq__list"),u=0,v=g.length;u<v;u++)g[u].addEventListener("click",function(t){"DT"===t.target.nodeName&&e(t.target.nextElementSibling).slideToggle()});e(document).on("js-initialized",function(){var e=document.getElementById("js-page-header");e&&e.classList.add("is-active")})}(jQuery);

この記事は役に立ちましたか?

もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

同じテーマのカスタマイズ記事