Cookie policy popunder

Developer
Benjamin Réthoré
Size
3,743 Kb
Views
22,264
  1. Cookie policy popunder Previews
  2. Cookie policy popunder HTML Codes
  3. Cookie policy popunder CSS Codes
  4. Cookie policy popunder JS Codes

How do I make an cookie policy popunder?

Basic cookie acceptance popunder, javascript included. Paste it and forget it.. What is a cookie policy popunder? How do you make a cookie policy popunder? This script and codes were developed by Benjamin Réthoré on 04 January 2023, Wednesday.

Cookie policy popunder Previews
IQ Test

Cookie policy popunder - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Cookie policy popunder</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <h1>Welcome to my awesome website</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. At, ad. Laudantium non quis sed fugiat expedita enim quibusdam in, incidunt suscipit animi aspernatur repellendus voluptas nostrum, magnam aliquid nemo aperiam.</p>
<!-- COPY FROM THERE -->
<div class="cookiePolicy"> <div class="cookiePolicy__content"> Ce site utilise des cookies pour améliorer votre expérience utilisateur. En utilisant Thalasseo vous acceptez l'utilisation notre <a href="#">utilisation des cookies</a>. </div> <div class="cookiePolicy__close"> <svg viewPort="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg"> <line x1="1" y1="11" x2="11" y2="1" stroke="#208798" stroke-width="2"/> <line x1="1" y1="1" x2="11" y2="11" stroke="#208798" stroke-width="2"/> </svg> </div>
</div>
<!-- TO THERE --> <script src="js/index.js"></script>
</body>
</html>

Cookie policy popunder - Script Codes CSS Codes

body { font-family: sans-serif; font-size: 16px;
}
.cookiePolicy { box-sizing: border-box; position: fixed; z-index: 9999; bottom: 0; left: 0; right: 0; padding: 0 48px; height: 36px; line-height: 36px; text-align: center; background-color: #b3cdd1; color: #36555a; font-size: 14px; transform: translate3d(0, 36px, 0); transition: all 300ms cubic-bezier(0.77, 0, 0.175, 1); opacity: 0;
}
.cookiePolicy.is-active { transform: translate3d(0, 0, 0); opacity: 1;
}
.cookiePolicy a { color: #208798; text-decoration: none;
}
.cookiePolicy__close { position: absolute; top: 50%; right: 16px; width: 12px; height: 12px; margin-top: -6px; cursor: pointer;
}
.cookiePolicy__close svg { display: inline-block; fill: #208798;
}
@media screen and (max-width: 1024px) { .cookiePolicy { height: auto; padding: 24px 48px; line-height: 1.4; } .cookiePolicy__close { top: 27px; margin: 0; }
}

Cookie policy popunder - Script Codes JS Codes

// On ready
document.addEventListener("DOMContentLoaded", function() { // Create cookie function function createCookie(name, value, days) { var expires; if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); expires = "; expires="+date.toGMTString(); } else { expires = ""; } document.cookie = name+"="+value+expires+"; path=/"; } // Reading cookies function function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0) === ' ') { c = c.substring(1,c.length); } if (c.indexOf(nameEQ) === 0) { return c.substring(nameEQ.length,c.length); } } return null; } // Selectors var cookiePolicy = document.querySelector('.cookiePolicy'); var closeCookiePolicy = cookiePolicy.querySelector('.cookiePolicy__close'); var hasCookie = readCookie("visited"); // If the 'visited' cookie isn't set, show the popunder after 2 seconds if (!hasCookie) { setTimeout(function(){ cookiePolicy.classList.add('is-active'); }, 2000); } else { cookiePolicy.parentNode.removeChild(cookiePolicy); } // On clicking the popunder, hide it and set the cookie so we don't show it until 365 days cookiePolicy.addEventListener('click', function(e){ e.preventDefault(); cookiePolicy.classList.remove('is-active'); cookiePolicy.parentNode.removeChild(cookiePolicy); createCookie("visited", true, 365); });
});
Cookie policy popunder - Script Codes
Cookie policy popunder - Script Codes
Home Page Home
Developer Benjamin Réthoré
Username bnthor
Uploaded January 04, 2023
Rating 3
Size 3,743 Kb
Views 22,264
Do you need developer help for Cookie policy popunder?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Benjamin Réthoré (bnthor) Script Codes
Name
Simple tooltips
Fun form with currentColor
Responsive height typographic menu
Sample scss map
CSS Grid gallery
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!