Need to implement this at wordpress

CMS & WordPress
1

Hi,
so i am trying to have this modal box pop up delay and i tested it on the browser and it worked, however I am not sure how this is not working in wordpress … here is the code

<style>
#content{
			width: 750px;
			position: fixed;
			top: 5%;
			margin: 1 auto;
			height: 355px;
			border: black 0px solid;
			padding: 5px;}
			
#modal-box {
			font-family: "Arial", Georgia, sans-serif;
			position:fixed;
			top: 50%;
			left: 50%;
			width:750px;
			height: 355px;
			margin-top: -9em; 
			margin-left: -20em; 
			border: 1px solid #ccc;
			background-color: white;			
			z-index:9999;
			animation:opac 0.0s;
			display: none;
}

#modal-footer{
	padding:5px;position:relative;bottom:0;left:0;height:10%;width:100%;text-align:center;}}

#close{float:right;padding:2px 2px;background:#ccc;visibility:hidden;}
	
#modal-content
{width:100%;height:100%;overflow-y:scroll}
</style>
<script>
//delay
function checkCookie(){
  if (document.cookie.replace(/(?:(?:^|.*;\s*)completedSurvey\s*\=\s*([^;]*).*$)|^.*$/, "$1") !== "true") {
setTimeout(function(){document.getElementById('modal-box').style.visibility = "visible";},2000);
}

// buttons 
var no = document.getElementById('no');
no.onclick = function() {var div = document.getElementById('modal-box');
    if (div.style.display !== 'none')
        div.style.display = 'none';
}

//give FeedBack button == display survey
var survey = document.getElementById('accept');
survey.onclick = function() { var div = document.getElementById('modal-content');
div.innerHTML ="";
div.innerHTML ='<object style="width:100%; height:100%;" data="https://www.surveymonkey.com/" />';

hideNoButton = document.getElementById("no"). style.visibility="hidden"; 
// hides the No Thanks button when the GiveFeedback button is pressed
hideCloseButton = document.getElementById("close").style.visibility="visible";
//shows the close button when the feedbackbutton is clicked
hideAcceptButton = document.getElementById("accept").style.visibility="hidden";
//hides the GiveFeedback button when the GiveFeedback button is pressed

div.style.overflow='hidden';
}

var close = document.getElementById('close');
close.onclick = function () {
  if (document.cookie.replace(/(?:(?:^|.*;\s*)completedSurvey\s*\=\s*([^;]*).*$)|^.*$/, "$1") !== "true") {
	document.getElementById("modal-box").style.display="none";
	document.getElementById("close").style.display="none";
	document.cookie = "completedSurvey=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
	alert("cookie added!");
    }    
}
</script>
2

Can you share the html?

3

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.