只在第一次加載時啓動基礎兜風isuue

我正在使用基礎風箏並且每次加載網頁時都會啓動遊覽，但是如何才能在網頁第一次加載時才啓動遊覽？只在第一次加載時啓動基礎兜風isuue

我指的是Foundation joyride start only on first load這個問題。但不工作。

我的設置是..

<script src="~/Scripts/Foundation/foundation.js"></script> 
<script src="~/Scripts/jquery.cookie.js"></script> 
<script src="~/Scripts/Foundation/foundation.joyride.js"></script> 

<body> 

    ....................... 

    <ol class="joyride-list" data-joyride id="tour"> 
    <li data-id="welcome" data-text="Next" data-options="tip_location:top"> 
     <p>Welcome, you can manage your accont details here.</p> 
    </li> 
    <li data-id="numero2" data-button="End"> 
     <p>You can see all the Log details here.</p> 
    </li> 
    </ol> 
    <script> 
    $(window).load(function() { 
     $("#tour").joyride({ 
      cookieMonster: true, 
      cookieName: 'JoyRide' 
     }); 
    }); 
    $(document).foundation(); 
    $(document).foundation('joyride', 'start'); 
</script> 
</body>

來源

2014-02-21 neel

注：如由@Eduardo評論指出，這個基金會5錯誤已得到修復，所以你不應該需要這個技巧對於兜風插件工作如果您使用的是最新版本的基金會5

你在你的標記class="joyride-list"有這個，所以我假設你使用的基礎5.

基金會的在線文檔非常具有誤導性。我遇到了這種類型的牆，那是在浪費了大量時間和頭髮之後，我才從源頭獲得解決方案。

首先，joyride設置不是camelCase，與您在聯機文檔中找到的內容相反。因此cookieMonster實際上是cookie_monster和cookieName實際上是cookie_name

接下來，joyride.js檢查未設置cookie的是這樣的：

if (!this.settings.cookie_monster || this.settings.cookie_monster && $.cookie(this.settings.cookie_name) === null) { 
    this.settings.$tip_content.each(function (index) { 
    var $this = $(this); 
    this.settings = $.extend({}, self.defaults, self.data_options($this)) 

    // Make sure that settings parsed from data_options are integers where necessary 
    for (var i = int_settings_count - 1; i >= 0; i--) { 
     self.settings[integer_settings[i]] = parseInt(self.settings[integer_settings[i]], 10); 
     } 
     self.create({$li : $this, index : index}); 
    });

問題是$.cookie(this.settings.cookie_name)回報undefined（至少在我自己安裝它）不是null因此，如果您將cookie_monster設置爲true，則永遠不會調用兜風的開始。

理想情況下，你應該需要做的是：

<script> 
    $(document).foundation({ 
    'joyride': {'cookie_monster': true} // not cookieMonster 
    }).foundation('joyride', 'start'); 
</script>

但是，這不會因爲錯誤的工作，所以你可以解決它，此代碼：

<script> 
    $(document).foundation({ 
    'joyride': { 'cookie_monster': !$.cookie('joyride') ? false : true, 
       post_ride_callback : function() { 
        !$.cookie('joyride') ? $.cookie('joyride', 'ridden') : null; 
       } // not cookieMonster 
       } // * edited original answer, missing closing bracket 
    }).foundation('joyride', 'start'); 
</script>

希望這有助於。

來源

2014-02-28 13:09:48 Tundebabzy

我用你的最後一個腳本，它不起作用，你可以解釋我應該怎麼做，在這裏你可以檢查http://jsfiddle.net/umairshah/8sj0sw3e/2/ –

有趣的是，我已經修復2014年1月12日發佈此帖之前幾周，Joyride上的這個bug可能不是您使用的回購版本。從那時起，就不應該需要這種攻擊，例如在Foundation 5上。 – Eduardo

一個簡單的方法是使用本地存儲。下面見代碼：

if (!localStorage['tutorial']) { 
    localStorage['tutorial'] = 'yes'; 
    $(document).foundation('joyride', 'start'); 
}

這是要兜風開始只是首次在網頁加載。

我希望我幫你！ =）

來源

2014-07-18 20:39:14 RaySaraiva

完美的工作！謝謝。 – Libin

只在第一次加載時啓動基礎兜風isuue

回答

相關問題