Scrollmagic ajaxページの読み込みの問題

Question

私は現在、Ajaxでページを読み込んでScrollmagicを使っていくつかの視差効果を行うために異なるコンテナのポイントをトリガするWordpressページを設定しています。

最初のページビューでは、すべて正常に動作し、視差スクロール効果が期待通りに行われ、トリガーポイントが設定されます。

ただし、メニューを使用して新しいページに移動すると、「Uncaught TypeError: Cannot read property 'hasAttribute' of null」と表示されます。私はこれは、私はすでに既存のトリガポイントを削除していないか、新しいものを追加する前にそれらを削除していない可能性がありますが、これが問題であるかどうかはわかりません。私はScrollmagicための次の関数を使用しています

は準備ができて、ドキュメント上で実行され、トリガー：私は何とか新しいページがアヤックスでロードされるたびにトリガを再初期化する必要があると推測してい

initSections: -> 
    controller = new ScrollMagic.Controller() 
    for $section in $('.page-row, .scroll-trigger') 
     do -> 
      scene = new (ScrollMagic.Scene)(
       triggerElement: $section 
       triggerHook: 0.75 
       ) 
      .setClassToggle($section, 'in-view') 
      .addIndicators() 
      .addTo(controller) 

。これは、私は以下のコードをやっている：ここ

bindNavLinks: -> 
    # Bind initial url 
    url = window.location.href 
    window.history.pushState({path: url}, url, url) 

    $.ajaxSetup({cache:false}) 
    $('nav.main li a, .page_item a').click (e) => 
     e.preventDefault() 
     pageUrl = $(e.target).attr('href') 
     if pageUrl != window.location.href 
      window.history.pushState({path: pageUrl}, pageUrl, pageUrl) 
      @loadUrl(pageUrl) 

loadUrl: (url) -> 
    setTimeout (-> 
     $('#main').load url + ' #main > *', (response, status, xhr) -> 
    ),2000 

を参照してくださいコードペン：http://codepen.io/fennefoss/pen/RKbdOe

Answer 1

いくつかの苦労の後、私はAjaxの機能と一緒に初期化するために私のスクロール魔法のシーンを書き直しました。私は使用しました：

scene = scene.destroy(true); 

私はAjax呼び出しを行うたびにシーンを破壊し、トリガーピンをリセットします。