0

好的，所以我有一个从屏幕顶部向下切换的菜单栏。我只希望用户在他们第一次访问该网站时看到这个。我如何防止它在他们访问的每个后续页面上播放？

我的 jQuery：

$(function() {

    $(".bar-top").delay(700).animate({
        marginTop: '0px'
    }, 750, 'swing');


    if ( $(".banner-title").css('display') == 'block' ) {
        $(".banner-title").delay(1500).addClass("fade");
        $(".fade").fadeIn("slow");
        $(".fade").hide();
    }

});

我已经研究过设置一个cookie，但到目前为止还没有正常工作。主要是因为我不确定如何将其包装在 cookie if 语句中。这banner-title只是在导航旁边淡入的一些文本。

我在想有没有办法只在索引页面上运行代码，并防止它在其他任何地方运行？不过，这可能不是一个很好的解决方案。

4

2 回答 2

1

假设您的用户未通过您的站点进行身份验证，在页面请求之间保持状态的唯一方法是设置 cookie。

有一个很棒的用于 cookie 管理的 JavaScript API，你应该看看 - https://github.com/js-cookie/js-cookie

当用户访问您的网站时，您可以检查您的 cookie 以查看他们以前是否访问过该网站。如果他们还没有显示您的动画并设置 cookie。如果他们有然后不要运行动画。

从文档一目了然js-cookie，您可以将 cookie 设置为 7 天，如下所示：

Cookies.set('visited', 'value', { expires: 7 });

所以你的代码可能看起来像：

// Make sure DOM has fully loaded before running code
$(function(){
    if( ! Cookies.get('visited')){
        // Your code here
        Cookies.set('visited', 'yes', { expires: 7 });
    }
});

编辑以回答您问题的其他部分（感谢 Max Allen 的提醒！）

为了只在某些页面上运行代码，我建议在页面的 body 标记上使用 ID（和类，如果你喜欢的话）。例如

if ($('body#index').length){
    // Code to only run on index page
}
于 2012-09-16T01:52:02.983 回答
0

好吧，@Tim Fletcher 回答了你的一些问题。

我在想有没有办法只在索引页面上运行代码，并防止它在其他任何地方运行？不过，这可能不是一个很好的解决方案。

那么可能有一个解决方案：

if(window.location.pathname == '/index.html'){
//Your code
}

但我不会说这是好是坏。但它可能会奏效。

于 2012-09-16T01:57:40.300 回答