Zurb Foundation .sticky自下而上在页面加载页面顶部闪烁

时间:2018-10-23 20:21:48

标签: javascript zurb-foundation sticky zurb-foundation-6

我在网站上有一个cookie警告横幅,我想向尚未看到它的用户显示(检查cookieInformation cookie,如果没有,请显示该横幅)。问题在于,该函数过去曾与window.onload函数一起使用,但是最近window.onload从未触发过。如果我使用document.ready,则横幅广告会在屏幕顶部闪烁,然后再粘贴在应有的底部。

我将为该函数设置一个超时,但是,如果这是基础加载问题,则在缓慢加载时仍会出现闪存。

是否有像Foundation.ready这样的基础回调函数可用于调用此函数?

.container#cookieTin(data-sticky-container)
        .cookiebanner.is-hidden.sticky(in-view="$inview == false ? cookieAccept() : '' ", data-sticky='', data-stick-to="bottom", data-options="stickyOn: small;", data-margin-bottom="0", data-closable )
            .small-12.medium-6.columns
                strong !{ __("cookie.line_1")}
                br
                span !{ __("cookie.line_2")}
            .small-12.medium-6.columns
                a.cookieButton.button !{ __("cookie.line_3")}
                button.close-button.cookieButton(aria-label='Close alert', type='button', data-close)
                    span(aria-hidden='true') ×

JS:

function showCookieBanner() {
        $('.cookiebanner').removeClass("is-hidden");
    }

$(document).ready(function () {
        $(".cookieButton").click(function () {
            closePopup();
        });
        var closePopup = function () {
            $('.cookiebanner').css("display", "none");
            createCookie('cookieInformation', 'seen', '15');
            return false;
        }
        if (getCookie('cookieInformation') == null) {
            showCookieBanner();
        }
    });

我尝试添加.no-js类以及eventListeners都没有用。

0 个答案:

没有答案