Настройка всплывающего файла cookie

Question

Я пытаюсь сделать типичное всплывающее окно, которое теперь имеет каждая страница. «Этот сайт использует файлы cookie. Продолжая просматривать сайт, вы соглашаетесь на использование файлов cookie».

Я создал этот код, чтобы сделать всплывающую пропадают, нажав на кнопку закрытия, но каждый раз, когда я загрузить страницу, всплывающее еще видна ...

Я также хотел бы знать, что время истечения срока действия обычного печенья для таких всплывающих окон ...

Вы можете мне помочь?

HTML5

<div id="cookies_alert"> 
    <div class="cookies_container"> 
    <div class="cookies_close"></div> 
     <div class="cookies_text">This site uses cookies. By continuing to browse the site, you are agreeing to our use of cookies.</div> 
    </div>  
</div> 

CSS3

#cookies_alert { 
    bottom: 20px; 
    height: auto; 
    left: 0; 
    margin: 0 auto; 
    padding: 0; 
    position: fixed; 
    right: 0; 
    width: 320px; 
    z-index: 998; 

    -webkit-transition: all 0.5s ease-out; 
     -moz-transition: all 0.5s ease-out; 
     -o-transition: all 0.5s ease-out; 
      transition: all 0.5s ease-out; 
} 

#cookies_alert.closed { 
    bottom: -120px; 

    -webkit-transition: all 0.5s ease-out; 
     -moz-transition: all 0.5s ease-out; 
     -o-transition: all 0.5s ease-out; 
      transition: all 0.5s ease-out; 
} 

#cookies_alert .cookies_container { 
    background-color: rgba(0,0,0,0.85); 
    padding: 15px; 
    padding-right: 35px; 
    position: relative; 
} 

#cookies_alert .cookies_close { 
    background-image: url("../images/menu.svg");  
    background-position: center -13px; 
    background-size: 13px; 
    height: 13px; 
    position: absolute; 
    right: 10px; 
    top: 10px; 
    width: 13px; 
} 

#cookies_alert .cookies_close:hover { cursor: pointer; } 

#cookies_alert .cookies_text { 
    color: #FFF; 
    font-family: Comfortaa; 
    font-size: 0.8em; 
} 

#cookies_alert .cookies_text a { color: #EA504E; } 

#cookies_alert .cookies_text a:hover { text-decoration: underline; } 

JS

$('.cookies_close').on('click', function() { 
    if($.cookie('Terms')){ 
     $('#cookies_alert').addClass("closed"); 
    } else { 
     $.cookie('Terms', 'Terms', { expires: 7 }); 
     $('#cookies_alert').removeClass("closed"); 
    } 
}); 

PD: Я использую JQuery плагин печенья ... https://plugins.jquery.com/cookie/

Answer 1

Я думаю, что ваше всплывающее окно есть visib le при обновлении страницы, потому что вы проверяете cookie на .cookies_close клик. Я бы сделал что-то вроде этого:

$(document).ready(function(){ 

if($.cookie('Terms')){ 
    $('#cookies_alert').addClass("closed"); 
} 

$('.cookies_close').on('click', function() { 
    $.cookie('Terms', 'Terms', { expires: 7 }); 
    $('#cookies_alert').addClass("closed"); 
}); 
});