問題タブ [locomotive-scroll]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 機関車スクロール要素の位置を取得
スムーズなスクロール効果のために Locomotive Scroll を使用しています。
特定のセクションに到達したら、背景色と HTML 全体の色を変更する必要があります。現時点では、機関車の呼び出しイベントを使用して「updateBg」というカスタム関数を追加しています。呼び出されると、ラッパーの背景と色が変更されます。
トリッキーな部分は、セクションがまだビューポートにあり、スクロールを逆にすると、色が変わらないことです。
例: 2 番目のイントロ セクション (および最初のイントロがビューポートにある) までスクロールすると、黒い背景に変わります。しかし、上にスクロールしても、セクションがビューポートから出ず、最後の呼び出しが黒い背景であったため、白い背景に変わりません。
色を反転できるようにするには、セクションを完全に通過する必要があります。
唯一のアプローチは、セクションのオフセット上部を見つけ、セクションのオフセット上部と機関車のスクロールデルタに基づいて色を設定することだと思います。問題は、オフセットを取得できる唯一の場所は、呼び出しイベントがトリガーされたときです。
ロード時にすべてのセクションオフセットトップを取得するにはどうすればよいですか? 誰かが別の回避策を考えられますか?