I'm trying to do the typical pop-up that every page has now. "This site uses cookies. By continuing to browse the site, you are agreeing to our use of cookies."
I have created this code to make the pop-up dissapear by clicking the close button, but everytime I load the page, the pop-up is still visible...
I would also like to know what's the normal cookie's time expiration for these kind of pop-ups...
Can you help me?
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");
}
});
P.D.: I'm using a JQuery Cookies Plugin... http://ift.tt/1zsvKxm
Aucun commentaire:
Enregistrer un commentaire