x秒后滑动面板，关闭点击 - 设置COOKIE [英] Slide panel up after x seconds, close on click - SET COOKIE

问题描述

希望有人可以指出正确的方向。

hoping someone can point me in the right direction.

我们正在尝试改善我们的邮寄名单的订阅。当用户在x秒钟后访问我们的网站时，我想要一个面板向上滑动，要求他们注册邮件列表。

We're trying to improve subscriptions to our mailing list. When a user visits our site after x amount of seconds, i'd like a panel to slide up asking them to sign up to the mailing list.

如果他们点击任何的按钮（注册，关闭，不再显示）我想设置一个cookie，所以面板不会再显示。

If they click any of the buttons (sign up, close, dont show again) I want to set a cookie so the panel doesn't show again.

我已经掌握了幻灯片/ down但是我是一个新手的cookie侧的东西，不知道如何设置它所以当cookie设置，幻灯片动作不会再次发生。

I've mastered the slide up/down BUT i'm a newbie at the cookie side of things and not sure how to set it so when the cookie is set, the slide action doesn't occur again.

这是我的jQuery ...

Here's my jQuery...

// MAILING LIST SLIDER //
        // set a delay of 3 seconds before mailing list panel appears 
        $("#mailingListPanelSlide").delay(3000).slideDown("slow");

        // set triggers to close the mailing list panel & set cookie
        $("a#closeButton, p.negativeActionFormButton").click(function(){
            $("div#mailingListPanelSlide").slideUp("slow");
            $.cookie("mailingListPanel", "dontshow");
            }); 

        // HELP!!!! if cookie is set to collapsed, then don't perform slide down/hide panel altogether?
        var mailingListPanel = $.cookie("mailingListPanel");
        if (mailingListPanel == "dontshow") {
            $("div#mailingListPanelSlide").css("display","none");
            };


        //END MAILING LIST SLIDER //    

推荐答案

   if ($.cookie("mailingListClosed") == null && $.cookie("mailingListNeverShow") == null) {
            $("#mailingListPanelSlide").delay(4000).slideDown("slow");
        };

        // Trigger for close panel button. Close panel and set session cookie
        $("a#closeButton").click(function () {
            $("div#mailingListPanelSlide").slideUp("slow");
            $.cookie("mailingListClosed", "true", { path: "/" });
        });

        // Trigger for never show panel button. Close panel and set persistent cookie
        $("p.negativeActionFormButton").click(function () {
            $("div#mailingListPanelSlide").slideUp("slow");
            $.cookie("mailingListNeverShow", "true", { expires: 365, path: "/" });
        });

        // Set persistent cookie if user clicks on the newsletter button as well
        $("p.genericLinkButton").click(function () {
            $.cookie("mailingListNeverShow", "true", { expires: 365, path: "/" });
        });

这篇关于x秒后滑动面板，关闭点击 - 设置COOKIE的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！