fixed版 DOMとWebGLのスクロール一致サンプル

静止画のimg要素に、全面canvasのWebGLでエフェクトを加えています。
本実装方法はtransformアニメーション（CSS transition,animation）と相性が悪いようです。
（gsapのようにstyle属性を直接書き換える場合はズレなさそう？）

■fixed版の特徴
スクロールはブラウザの挙動を活かしてはいますが、厳密には異なるものになります。
固定表示のオブジェクトの配置が可能です。
アニメーションに正確なスクロール量が必要な場合に向いています。

absolute版はこちら

v2.0.2
X:@beffell


メモ こういう順序で処理されてるのかな・・・

レイアウト（CSS・style属性）
transform以外のCSS transition,animationの計算
requestAnimationFrame
microtask
transformのCSS transition,animationの計算
レンダリング（画面表示）
macrotask