Hello Pullo your code color box is perfect in my project . Could you please tell me how do I insert an Interval function in order to repeat the popup each 15 minutes. Just if it’s possible.
Hi Pullo , me again … really I do not much about Javascript , could you please insert your code in my file that I sending you ?
Thank you and sorry to ask you again.
This looks like a solution that I need, but I have tried using this code and it doesn’t work. Is there perhaps something missing from this example code?
I tried creating the colorbox with cookies so it would only appear once. Below is the code that I am using. I also made sure to get jquery.cookie.js, and I put it in the root folder with the index file and the css file.
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>ColorBox demo</title>
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example1/colorbox.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://www.jacklmoore.com/colorbox/jquery.colorbox.js"></script>
<script src="jquery.cookie.js"></script>
</head>
<body>
<h1>Hello, there!</h1>
<h2>This is some content</h2>
<p>The popup will open in <span id="seconds">1</span> second</p>
<script>
function openColorBox(){
$.colorbox({iframe:true, width:"80%", height:"80%", href: "http://www.teotech.com"});
}
function countDown(){
seconds--
$("#seconds").text(seconds);
if (seconds === 0){
openColorBox();
clearInterval(i);
}
}
var seconds = 1,
i = setInterval(countDown, 1000);
if(!$.cookie("colorboxShown")){
openColorBox();
$.cookie('colorboxShown',"yes", true, { expires: 1, path: '/' });
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>ColorBox demo</title>
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example1/colorbox.css" />
</head>
<body>
<h1>Hello, there!</h1>
<h2>This is some content</h2>
<p>The popup will open in <span id="seconds">5</span> seconds</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://www.jacklmoore.com/colorbox/jquery.colorbox.js"></script>
<script>
function openColorBox(){
$.colorbox({iframe:true, width:"60%", height:"60%", href: "content.html"});
}
function countDown(){
seconds--
$("#seconds").text(seconds);
if (seconds === 0){
openColorBox();
clearInterval(i);
}
}
var seconds = 5,
i = setInterval(countDown, 500);
</script>
</body>
</html>
and this is the content wants to load in th epopup window
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="/scripts/colorbox/jquery.colorbox-min.js"></script>
<script>
$('#btnClose').live('click', function () {
alert('closing...'); // Alert shown as expected
$.colorbox.close(); // Nothing happens, no JavaScript error
//$.fn.colorbox.close(); // same
//parent.$.fn.colorbox.close(); // same
//$.colorbox.remove(); // same
//$('#cboxClose').click(); // same
//$('#cboxOverlay').click(); // same
});</script>
</head>
<body>
<div style="width:50%; float:left">
<div align="center" style="margin-left:10px; padding-top:50px">
<h1>Realestate Owners, Developers and Brokers.</h1>
<a id="btnClose" href="http://plotmall.com/list-plot.php">
<input type="button" value="Post Properties Free" style="width:230px; height:50px; background:#093; border-radius:8px; color:#FFF; font-size:18px"></a>
</div>
</div>
<div style="width:50%; float:right">
<div align="center" style="margin-right:10px; padding-top:50px">
<h1>Want To Buy/Rent Flat, Villas and Commercial Spaces.</h1>
<a href="http://www.plotmall.com/list-requirements.php">
<input type="button" value="Post Requirements Free" style="width:230px; height:50px; background:#06C; border-radius:8px; color:#FFF; font-size:18px"></a>
</div>
</div>
</body>
</html>
both the files are running currectly…but the link in the button (href=“plotmall.com”) is loaded inside the same popup window. i need that, when we click in the button(post property free) the popup will be closed and the link url open outside the popup window