Question

使用新的Cookie规则，就像我们所有人一样，我需要向用户显示一条消息，通知他们我在网站上持有的cookie。我做了一些研究，我见过的最好的例子是http://www.packtpub.com。

我的网站上有jQuery，但我不知道它有多少工作。我想知道是否有人可以阐明如何实施类似的解决方案。我已经厌倦了解如何在packtpub.com上完成它，但它有点超过我的头脑。我已经搜索了模态和粘性模态，但是我没有找到一个很好的例子，我可以产生类似的解决方案，因为大多数对话模态看起来像是通过灰化背景直到对模态执行某些操作。

如果我能重新创建类似的解决方案，我将不胜感激。

谢谢。

Answer 1

使用您的内容创建一个元素

<div id="cookie-notification">
    <!-- Your content goes here !-->
    <a href="#" id="close-notifiction">Close for now</a>
    <a href="#" id="close-notifiction-forever">Never show again</a>
</div>

使用css将其固定在底部，并使用较大的z-index将其置于其他顶部。

#cookie-notification{
    position : fixed;
    bottom : 10px;
    right : 10px;
    z-index : 99999;
    //more of your styles ..
    }

现在您的页面右下方有通知。

现在用jQuery隐藏它。

$('#close-notification').click(function(){
    $('#cookie-notification').fadeOut(300);
    return false;
    }

要“不再显示此内容”，请将Cookie设置为永不再显示此内容，检查页面加载时是否设置了此Cookie，如果是这种情况则隐藏通知。

$('#close-notification').click(function(){
    $('#cookie-notification').fadeOut(300);
    createCookie('show-notification','never',9999); 
    //refer the link below and use the code from there to make create cookie work
    return false;
    }

//检查页面加载时是否设置了cookie

$(document).ready(function(){
    if(readCookie('show-notification') == 'never'){
            $('#cookie-notification').hide();
            }
    }

以下是此页面底部的Cookie代码http://www.quirksmode.org/js/cookies.html

jQuery粘性对话模式

1 个答案: