“Timer Popup JavaScript” Kode Jawaban

Timer Popup JavaScript

function showIt() {
  document.getElementById("hid").style.visibility = "visible";
}
setTimeout("showIt()", 3000); // after 3 seconds

//CSS
.popup-box{
	display: none;
	position: fixed;
	text-align: center;
	width: 100%;
	height: 100%;
	z-index: 10;
	top: 0;
	left: 0;
}

.popup-inner{
	max-width: 300px;
	min-height: 160px;
	background: white;
  border-radius: 25px;
	padding: 15px;
	margin: auto;
	top: 25%;
	position: relative;
}



.popup-msg{
	font-weight: bold;
	color: black;
	padding: 20px 20px 0 20px;
}

.next-step-btn{
	margin:20px auto 0;
background: linear-gradient(rgb(204,0,0), rgb(130,0,0));
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#015eab', endColorstr='#10276b');
	border: none !important;
	padding: 10px 40px !important;
	color: #fff !important;
	font-weight: bold;
	border-radius: 3px;
	cursor: pointer;
}

.transparent-layer{
	position: fixed;
	width: 100%;
	height: 100%;
	background: #000000;
	opacity: 0.3;
overflow: hidden;

}

//html
<div class="popup-box" id="hid" style="display: block; visibility: hidden">
								<div class="transparent-layer"></div>
								<div class="popup-inner" style="">
				
									<div class="popup-msg">I'm a popup. .</div>
									
								<button class="next-step-btn" onclick="location.href = 'www.facebook.com';">I'M THE BUTON</button></div>
							</div>