jQuery:如何只在永久网站元素中淡入一次

Question

我正在构建的网站在每个页面上都有一些相同的元素，比如徽标、菜单、版权声明等等

我想在访问者加载网站的任何页面时将其淡入，并且永远不要为访问者可能到达的任何其他页面重播淡入效果。

我知道制作AJAXy网站将是解决方案之一，但出于某些原因，在这种特殊情况下，拥有单独的页面会更可取。

也许有一种方法可以检查元素的不透明度（来自上一页？），如果是100%保持原样，则否则会在元素中淡入-但我不确定如何做到这一点。或者，如果有一种方法可以检查是否访问者从同一主域名到达页面，在这种情况下，所有元素的不透明度应该等于100%，否则它们应该淡入？

我将感谢一个切实可行的解决方案！

StackOverflow上的其他人在类似的情况下写道"只需使用cookie"，并接受了一个解决方案，但没有提供cookie的实际示例，如果有人能做到这一点，那将是最有帮助的。

Answer 1

您可以为加载的每个元素设置一个uniquie cookie值，并在每个页面上对其进行检查，以确定是否淡入。

http://plugins.jquery.com/files/jquery.cookie.js.txt

var loaded = $.cookie('loaded');
loaded = (typeof(loaded) == 'string') ? loaded.split('|') : [];
if($.inArray('unique_key', loaded) == -1) {
  alert('first load');
  $('#element').fadeIn();
  loaded.push('unique_key');
  $.cookie('loaded', loaded.join('|'));
} else {
  alert('subsequent load');
  $('#element').show();
}

Answer 2

您可以查看客户端的referrer（使用JavaScript）-如果它包含您的域，您就知道用户来自您网站上的另一个页面。

类似。。。（未经测试）

if (document.referrer.indexOf('www.mydomain.com' === -1) {
  // show animation
}

这将显示用户每次从另一个位置访问您的网站时的动画，而使用cookie方法，如果用户以前去过，您将知道cookie的使用寿命。

此外，这种方法可能需要修改以使用不区分大小写的正则表达式，因为我认为indexOf是区分大小写，并且可能有人键入了错误的URL

Answer 3

您可以"仅使用cookie"来标记动画已播放。哈哈，刚刚看到你帖子的最后一部分。我是这个库jQuery Cookie的粉丝。此外，我将其封装在一个数据提供程序JS类中，如下所示：

mycompany.data.cache = {
    grab: function(key){
        return $.evalJSON($.cookie(key));
    },
    push: function(key, value){
        $.cookie(key, $.toJSON(value), {path: '/', expires: 7});
    },
    remove: function(key){
        $.cookie(key, null);
    }
};

所以你可以写

$(document).ready(function(){
    bool animationPlayed = mycompany.data.cache.grab('animationPlayed');
    if(!animationPlayed)
        //play animation...
    else
        //do something else...
});

Answer 4

不确定您的后端框架是什么，但在ASP.NET中，如果是真的，您可以检查Session.IsNewSession并向这些元素（即firstTimeFadeIn）添加一个类。。。对该类的所有项运行淡入的jQuery代码将非常简单。