スクロール時にパスに沿って背景画像の位置を移動する

Question

これは完全に配置されていない場合、私が最初に投稿したものです。

http://artofflightmovie.com/

背景画像すなわちコのパスに沿って移動：

は基本的に私は見事レッドブルアートフライトの映画のウェブサイト上で利用されているのと同じまたは類似の効果を達成しようとしていますユーザーがページを下にスクロールするときに、 - 座標。私は現時点で背景のアニメーションだけのコンテンツアニメーションを心配する必要はありません。

私はBにアニメーションから背景を移動する、基本的な操作を行うことが可能ですが、私はCに、DからCなどなどB

から行きたいとき、私が試してみました何をすべきかにstauck午前公然と利用できるを使用した：

​​

これは時にユーザーがスクロール私は背景位置の変更を設定することができますが、私は、次のアニメーションを設定する方法を確認していません。私の最初の考えはelseを使うことでしたが、これは成功しませんでした。

artofflightmovie.comの例では、背景位置のpx測定値の配列を設定し、タイムラインのように読み取っています。

私はCSSを使用したいと思っていますが、jQueryの知識は私が持っている問題を克服することができないレベルまではありません。

私はArt Of Flightページのソースを取得しており、単純化したバージョンを作成してビルドを試みましたが、大きな利点はありません。

すべてのヘルプは、入力された男性のための

Answer 1

おかげでいただければ幸いです。パスをレンダリングするためにcanvas要素を使用し、jQueryのは、それに沿ってスクロールを制御http://joelb.me/scrollpath/

グレートjQueryプラグイン：

は、私は実際に私がここに後にしたもののようなものを発見しました。イベント/機能は、すべてのウェイポイントでトリガーすることもできます。