[星乃 みなみ]

トピックを新しく立てる方は次の項目も記述してください（要望トピックの場合は不要です）。

【お使いの Snow Monkey のバージョン】最新版
【お使いのブラウザ】chrome
【当該サイトのURL】https://kimsweddingmovie.com/

===

外部Jsの読み込み方ですが、以下の方法で間違いないでしょうか？

// ふんわりアニメーション
add_action(
	'wp_enqueue_scripts',
	function() {
		wp_enqueue_script(
			'effect-fade',
			'/wp-content/themes/snow-monkey/assets/js/common.js',
			[],
			false
		);
	}
);

よろしくお願いします。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

読み込み方はあっていますが、common.js ファイルの配置場所が不適切です。

僕がカスタマイズのコードを My Snow Monkey プラグインや追加 CSS に書くことを推奨しているのは、テーマに直接ファイルを配置したりコードを書くと、テーマをアップデートしたときにそれらのファイルやカスタマイズがすべてなくなってしまうからです。アップデートのときは、一度テーマ内のファイルがすべてネット上にある最新のファイルに置き換えられるためです（プラグインや WordPress コアの場合も同様）。

そのため、上記の common.js ファイルは My Snow Monkey の中に配置して呼びだすのが良いです。

♥ 0

いいねをした人: 居ません

[星乃 みなみ]

スクリプトの配置を以下に変更しました。

/wp-content/plugins/my-snow-monkey/assets/js/common.js

よくある、下からふわっとあらわれる表現のためのコードなのですが、うまく動作しません。
サポートスコープから離れるかもしれませんが、何か原因として考えられることはありませんでしょうか

TIPS & NOTE 要素をふわっと出す、css3アニメーションで簡単エフェクト。

要素をふわっと出す、css3アニメーションで簡単エフェクト。

littlethings.jp

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

ブラウザのコンソールを確認してみてください。

Uncaught TypeError: $ is not a function

というエラーがでています。おそらく

$(function() {
  〜
} );

のようなコードを書かれているのではないかと想像しますが、WordPress の jQuery はいきなり $ を参照することができなくなっています（おそらくコンフリクトを防ぐため）。もしそうであれば、

jQuery(function( $ ) {
  〜
} );

のように変更すると動くはずです。

♥ 0

いいねをした人: 居ません

[星乃 みなみ]

window.onload = function() {
  scroll_effect();

  jQuery(window).scroll(function(){
   scroll_effect();
  });

  function scroll_effect(){
   jQuery('.effect-fade').each(function(){
    var elemPos = $(this).offset().top;
    var scroll = $(window).scrollTop();
    var windowHeight = $(window).height();
    if (scroll > elemPos - windowHeight){
     jQuery(this).addClass('effect-scroll');
    }
   });
  }
};

jQueryにかえたところが、もともと$だったところなのですが、動きません。
でもいい加減、snow-monkeyのことじゃないので、あれですよね
いろいろやってみます

ありがとうございました。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

そうですね、Snow Monkey のサポートではなくなっているのであれですが… $ が残っているので全部 jQuery に変えると動かないですかね？

僕が上で

jQuery(function( $ ) {
  〜
} );

と書いたのは、ググればすぐでてきますが、$ をグローバルスコープに影響しない形で使う方法になります。ちょっとご提示のコードの場合だと window.onload = function() {} で囲ってあるのでややこしいかもですが、WordPress で jQuery を使う場合は僕の提示した上のコードで全体を囲って、その中で $ を使うのが標準的な手法だと思います。Snow Monkey のサポートの範疇ではないので詳しくはググってもらえればと思います。

♥ 0

いいねをした人: 居ません

[投稿者]

投稿