Skip to content

Instantly share code, notes, and snippets.

@adityarao310
Created June 17, 2021 21:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save adityarao310/3215b21db54c1daf5ef020c81e64f01a to your computer and use it in GitHub Desktop.
Save adityarao310/3215b21db54c1daf5ef020c81e64f01a to your computer and use it in GitHub Desktop.
Webflow popup modal after few seconds on page
<!-- put this at the webflow section called "inside <head> tag on your page settings -->
<!-- popup_div is the id of the popup on your page -->
<!-- ensure that the popup is hidden by default -->
<head>
<style>
#popup_div[style*='display: block'] {
display: flex !important;
flex-direction: column;
justify-content: center;
align-items: center;
position: fixed;
top: 0%;
right: 0%;
bottom: 0%;
left: 0%;
}
</style>
</head>
<!-- put this at the webflow section called "before </body> tag on your page settings -->
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<script> $(document).ready(function () {
if ($.cookie('popup_show_cookie') == null) {
// no cookie found, let modal come up. On cross button click set cookie
$('#popup_div').delay(10000).show(0)
$('#close_popup').click(function () {
var expire = new Date();
expire = new Date(expire.getTime() + 604800000);
$.cookie('popup_show_cookie', 'yes', {
expires: expire
});
});
} else { $('#popup_div').hide() }
});
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment