Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save artursopelnik/d6327a7e852726ba67f968901934d464 to your computer and use it in GitHub Desktop.
Save artursopelnik/d6327a7e852726ba67f968901934d464 to your computer and use it in GitHub Desktop.
Cookie Consent - Create height for fixed popup with vanilla javascript
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script>
<script>
window.addEventListener("load", function () {
var wrapper = document.body,
cookieBarOptions = {
"palette": {
"popup": {
"background": "#000"
},
"button": {
"background": "#f1d600"
}
}
},
getCookieBar = function () {
return document.querySelector(".cc-window");
},
getCookieBarHeight = function () {
return getComputedStyle(getCookieBar())["height"];
},
getCookieBarBottomPosition = function () {
return (getComputedStyle(getCookieBar())["bottom"]);
},
setCookeBarHeight = function () {
wrapper.style.marginBottom = getCookieBarHeight();
wrapper.style.paddingBottom = getCookieBarBottomPosition();
},
setCookeBarHeightEmpty = function () {
wrapper.style.marginBottom = "";
wrapper.style.paddingBottom = "";
},
throttle = (function (type, name, obj) {
obj = obj || window;
var running = false;
var func = function () {
if (running) {
return;
}
running = true;
requestAnimationFrame(function () {
obj.dispatchEvent(new CustomEvent(name));
running = false;
});
};
obj.addEventListener(type, func);
})("resize", "rafResize");
cookieBarOptions.onPopupOpen = function () {
setCookeBarHeight();
window.addEventListener("rafResize", setCookeBarHeight);
};
cookieBarOptions.onPopupClose = function () {
setCookeBarHeightEmpty();
window.removeEventListener("rafResize", setCookeBarHeight);
};
window.cookieconsent.initialise(cookieBarOptions);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment