【jQuery→Javascript】固定した背景画像がスクロールで切り替わるモーションのJavascriptでのプログラミング

Question

お世話になります。

こちらのサイトのようなモーションのJavascriptでのプログラミングの仕方をお伺いしたいです。
リンク
（元のページはこちら→リンク）

こちらのサイトではjQueryでモーションを実装しているのですが、
現在作成中のサイトで別のモーションをjQueryで実装しているのですが、
そちらとコンフリクトが生じてしまったため、
素のJavascriptでプログラミングできないかと考えておりました。
（こちらでコンフリクトした状況を説明しています→リンク）

記述の仕方がご存知の方でご教授いただければ幸いです。

Comments

[miyabi_pudding]

> コンフリクトが生じてしまったため

どういうことでしょうか。
バージョン管理上の話でしょうか。
それとも、JSの挙動上で、処理がぶつかってしまう、ということでしょうか。

[ryo5ekine]

ご質問ありがとうございます。
２個目に挙げていただいた通り、JSの挙動上、２つの処理がぶつかってしまうということです。

Answer 1

Intersection Observer を使ってはいかがでしょうか。

Intersection Observer API - Web API | MDN

JSでのスクロール連動エフェクトにはIntersection Observerが便利 - ICS MEDIA

Intersection Observerが簡単で便利！要素がビューポートに表示されているかを判定できる | コリス

Comments

[ryo5ekine]

ご回答くださりありがとう等ございます。

素のJacascriptをしっかりと勉強しなくてはと思っておりますので、このように今回実装したいことのヒントを与えてもらえましたこと大変うれしく思います。