2017-10-09 7 views
-1

Bootstrap tourに問題があります。ブートストラップツアーは、ページをスクロールするときにのみロードされます。

私の問題

私は他のページへリダイレクトするときinit関数が呼び出されますが、自動的にツアーを続行しません。ブートストラップツアーは表示されません。このページにはAJAXフレームも含まれており、コンテンツはdocument.readyの後に読み込まれます。

AJAXフレームが読み込まれた後、ページを少しスクロールすると、ツアーが突然表示されます。私は機能startTour()を呼び出すボタンをクリックした後、だから、パート1のため#news_containerが直接表示されます

コード

var quick_tour = undefined, initialized = false; 
$(document).ready(function() { 
    setupTour(); 
}); 

function setupTour() { 
    quick_tour = new Tour({ 
     name: "quick_tour", 
     storage: window.localStorage, 
     steps: [ 
      { 
       element: "#news_container", 
       title: "Part 1", 
       content: "This is the Text number 1", 
       path: "" 
      }, 
      { 
       element: "#brand_title", 
       title: "Part 2", 
       placement: "bottom", 
       content: "And this is number 2", 
       path: "second.php" 
      }, 
     ], 
    }); 
    initTour(); 
} 

function initTour() { 
    if (!initialized) { 
     if (quick_tour === undefined) { 
      setupTour(); 
     } 
     quick_tour.init(); 
     initialized = true; 
    } 
} 

function startTour() { 
    quick_tour.restart(); 
} 

。最初の部分の後、2番目のページにリダイレクトされます。私はスクロールするだけで、ツアーは表示されません。

どうすればよいですか?ページを少しスクロールするトリガーを作成することはできますか?

ありがとうございます。

答えて

0

イベントトリガー$(window).scroll();で少し試した後、ついに自分でバグを修正しました。今度は関数を更新しました。

function initTour() { 
    if (quick_tour === undefined) { 
     setupTour(); 
    } 
    quick_tour.init(); 
    $(window).scroll(); //Performs an scroll 
} 
関連する問題