Countdown then Display a link?

**NairB** · 03-25-2007, 02:22 AM

John,

You are an absolute star

That works. How come you must use a capital L ??

Thanks again friend.

Oh, I will send you a PM.

-NairB

**jscheuer1** · 03-25-2007, 02:27 AM

You're welcome. It matters because the author of lightbox wrote it into the script that way and because javascript is a case sensitive coding language.

**taydu** · 12-18-2007, 05:12 AM

It's possible to show the countdown too ? 3 ... 2 ... 1 ... and show link

**jscheuer1** · 12-18-2007, 08:48 AM

Originally Posted by taydu

It's possible to show the countdown too ? 3 ... 2 ... 1 ... and show link

There are various ways depending upon the sort of layout you want this to have, here's one:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Count Down Link - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
document.write('<style type="text/css">#timed{visibility:hidden;}<\/style>')
function delay_link(){
var d=delay_link, t=document.getElementById('timed'); 
if(d.c&&d.c.nodeValue.replace(/[^\d]*/,'')-1>0){
d.c.nodeValue='\xa0\xa0'+(d.c.nodeValue.replace(/[^\d]*/,'')-1);
setTimeout('delay_link()', 1000)
return;
}
else if(!d.c){
d.c=document.createTextNode('10');
t.parentNode.insertBefore(d.c,t);
setTimeout('delay_link()', 1000)
return;
}
d.c.nodeValue='\xa0\xa0\xa0\xa0';
t.style.visibility='visible';
}
</script>
</head>
<body>
<div><a id="timed" href="whatever">Link Text or img tag</a> Hi</div>
<script type="text/javascript">delay_link();</script>
</body>
</html>

Edit: Here's another:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Count Down Link - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.cent {
text-align:center;
margin:0 auto;
}
</style>
<script type="text/javascript">
document.write('<style type="text/css">#timed{display:none;}<\/style>')
function delay_link(){
var d=delay_link, t=document.getElementById('timed'); 
if(d.c&&d.c.nodeValue.replace(/[^\d]*/,'')-1>0){
d.c.nodeValue='\xa0\xa0'+(d.c.nodeValue.replace(/[^\d]*/,'')-1);
setTimeout('delay_link()', 1000)
return;
}
else if(!d.c){
d.c=document.createTextNode('10');
t.parentNode.insertBefore(d.c,t);
setTimeout('delay_link()', 1000)
return;
}
d.c.nodeValue='';
t.style.display='inline';
}
</script>
</head>
<body>
<div class="cent"><a id="timed" href="whatever">Link Text or img tag</a></div>
<script type="text/javascript">delay_link();</script>
</body>
</html>

Notes: The nice thing about these two is that the link will be on the page when it loads. So, if it needs to be initialized onload, it will be. No extra steps need to be taken. The first method is good for content that must fit a particular layout, the second one can work for that too, but is centered and may not work well in an inline sort of situation.

**taydu** · 01-06-2008, 10:36 AM

thank you jscheuer1, it's possible to display this type of link after the counter id done ?

Code:

<a href='http://www.download.com/dsplus/ds.php?p=<filename />&amp;t=<token />'>Click Here to start your download</a>

I tried

Code:

<div class="cent"><a id="timed" href='http://www.download.com/dsplus/ds.php?p=<filename />&amp;t=<token />'>Click Here to start your download</a></div>
<script type="text/javascript">delay_link();</script>

it wouldn't work, what is wrong ?

**jscheuer1** · 01-06-2008, 02:57 PM

Works fine here:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Count Down Link - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.cent {
text-align:center;
margin:0 auto;
}
</style>
<script type="text/javascript">
document.write('<style type="text/css">#timed{display:none;}<\/style>')
function delay_link(){
var d=delay_link, t=document.getElementById('timed'); 
if(d.c&&d.c.nodeValue.replace(/[^\d]*/,'')-1>0){
d.c.nodeValue='\xa0\xa0'+(d.c.nodeValue.replace(/[^\d]*/,'')-1);
setTimeout('delay_link()', 1000)
return;
}
else if(!d.c){
d.c=document.createTextNode('10');
t.parentNode.insertBefore(d.c,t);
setTimeout('delay_link()', 1000)
return;
}
d.c.nodeValue='';
t.style.display='inline';
}
</script>
</head>
<body>
<div class="cent"><a id="timed" href='http://www.download.com/dsplus/ds.php?p=<filename />&amp;t=<token />'>Click Here to start your download</a></div>
<script type="text/javascript">delay_link();</script>
</body>
</html>

But - <filename /> and <token /> are probably supposed to be replaced with actual values, either by you or by the server.

**maxentertainment** · 01-21-2008, 05:14 PM

Please help me
i have a question
if i want write a test near the countdown for exemple:
">HERE#timed{display:none;}<
and Hide when display the link

how i can make ?

Thread: Countdown then Display a link?

Thread Tools

Search Thread

Bookmarks

Bookmarks

Posting Permissions