只在第一次加载时启动基础兜风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

回答

相关问题