That’s a WP short code for (presumably) the fancybox plugin.
Do you have the possibility to set 'closeBtn': true
in the plugins options?
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.
Appreciate
Edward
Here’is my example using your code
http://www.radio4me.online/livepopuptimed.html
Hey,
I guess you could use setInterval.
var fifteenMinutes = 1000 * 60 * 15;
var i = setInterval(function(){
// this will be called every 15 minutes
}, fifteenMinutes);
To cancel:
clearTimeout(i);
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.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
<!--
function popup(url)
{
params = 'width='+screen.width;
params += ', height='+screen.height;
params += ', top=0, left=0'
params += ', fullscreen=yes';
newwin=window.open(url,'windowname4', params);
if (window.focus) {newwin.focus()}
return false;
}
// -->
</script>
<script src="jquery.js"></script>
<script src="audioplayer.js"></script>
<script>
$( function()
{
$( 'audio' ).audioPlayer();
});
</script>
<meta charset=utf-8 />
<title>ColorBox demo</title>
<style type="text/css">
<!--
.style1 {font-size: 18px}
.style2 {font-size: 24px}
-->
</style>
<a href="javascript:window.close()"></a>
<p align="center">
<p align="center"><br>
<audio id="main_audio" src="http://sc-classrock.1.fm:8200" preload="auto" autoplay="autoplay" controls></audio>
<p align="center">
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example1/colorbox.css" />
<style type="text/css">
<!--
.style1 {font-size: 36px}
-->
</style>
</head>
<body>
<h1>Hello, there!</h1>
<h2> </h2>
<p>The <span class="style2">popup advertising</span> will open in <span id="seconds">5</span> seconds</p>
<p class="style1">RADIO LIVE 1 </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:"40%",
height:"80%",
href: "http://www.radio4me.online/80.html",
onLoad: function() {
$('#cboxClose').remove();
document.getElementById("main_audio").volume = 0.2;
setTimeout(function(){
$(window).colorbox.close();
document.getElementById("main_audio").volume =1;
}, 30000)
}
});
}
function countDown(){
seconds--
$("#seconds").text(seconds);
if (seconds === 0){
openColorBox();
clearInterval(i);
}
}
var seconds = 10,
i = setInterval(countDown, 2000);
</script>
</body>
</html>
First thing is this:
var seconds = 10,
i = setInterval(countDown, 2000);
This will make the popup open in 20 seconds. If that is what you want write:
var seconds = 20,
i = setInterval(countDown, 1000);
What you are asking is this:
var seconds = 10,
fifteenMinutes = 1000 * 60 * 15,
i = setInterval(countDown, 1000),
j = setInterval(openColorBox, fifteenMinutes);
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?
Nope
What have you tried? Could you provide some 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>
Are you running the script locally, or on a server?
Right now I am running it locally
That’s probably why the cookies aren’t working. Try running it on a server.
Hi,
I need to install Colorbox with Google Tag Manager
Do you think it is possible ?
Thanks
Eric
No idea, did you try it?
web site load open colorbox banner image add external link url visitor please ?
image and url example
<a href="http://www.site.com/bannerurl.html" target="_blank"><img src="http://www.site.com/wp-content/uploads/haziran.gif" ></a>
my code
<script>
var jq = $.noConflict();
function openColorBox(){
jq.colorbox({
iframe:false,
innerWidth:800,
innerHeight:600,
maxWidth:'95%',
maxHeight:'95%',
escKey: false,
loop: false,
scrolling: false,
overlayClose: false,
href: "http://www.site.com/wp-content/uploads/haziran.gif"
});
}
setTimeout(openColorBox, 1000);
setTimeout(function(){ window.parent.jq.colorbox.close(); }, 100000);
</script>
Sir,
Can I set limits for this popup?
Like, I want to show it for 10sec and then it’ll close automatically.
Thanks in advance.
Yeah, you can do that:
<!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">1</span> second</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 src="jquery.cookie.js"></script>
<script>
function openColorBox () {
$.colorbox({iframe: true, width: '80%', height: '80%', href: 'http://www.sitepoint.com'})
setTimeout(function () { $(window).colorbox.close() }, 10000)
}
function countDown () {
seconds--
$('#seconds').text(seconds)
if (seconds === 0) {
openColorBox()
clearInterval(i)
}
}
var seconds = 1
var i = setInterval(countDown, 1000)
if (!$.cookie('colorboxShown')) {
openColorBox()
$.cookie('colorboxShown', 'yes', true, { expires: 1, path: '/' })
}
</script>
</body>
</html>
This is the line that closes the colorbox:
setTimeout(function () { $(window).colorbox.close() }, 10000)
See here for more details: How to have a popup window open and close automatically
It works.
Thank You Sir.
You are so helpful.
is there any way to get a link from a button inside the colorbox and i need the link href to outside the popup window
Sorry, I don’t follow. Could you rephrase your question.
Also, please provide some code — what have you tried and what isn’t working?