...

View Full Version : Page rip or rolodex style countdown script?



Bengal313
09-01-2006, 06:02 PM
I looked everywhere but can't find this countdown script!
I am looking for a javascript or flash based countdown script that looks like a page is ripping as it counts down or a rolodex flipping.

rlemon
09-01-2006, 08:19 PM
well, after looking at your site (to try and find a attempted example) i noticed it is not very accessable.

A) FireFox does not render things as expected.
B) no scrollbars is NEVER a good idea. - i know it supports the 800*600 but i'm running 1280*1024.. looks horrendous in that resolution.
C) elements jump all over the page when resizing.

the general llayout looks good, but the accessability and the limited browsers / resultions kinda takes away from the experience.

furthermore, by page Ripping do you mean having the page edge look tattered, or have the page look like it's being ripped in half?

coothead
09-01-2006, 09:45 PM
Hi there shakim,

here is an example that may suit your requirements...

http://mysite.orange.co.uk/azygous/countdown1.html
...and here is the code...

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>countdown</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type="text/css">
/*<![CDATA[*/
body {
background-color:#eef;
}
#click {
width:150px;
line-height:25px;
text-align:center;
border:3px double #000;
background-color:#fff;
cursor:pointer;
}
#container {
width:310px;
height:200px;
border:3px solid #003;
background-image:url(http://mysite.orange.co.uk/azygous/images/bl_bg.jpg);
background-color:#006;
margin:10px auto;
}
#c_d {
line-height:200px;
overflow:hidden;
font-size:64px;
color:#003;
text-align:center;
background-color:#9797f9;
}
/*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[
var h=200;
var f=64;
var count=10;
var obj;
var test=0;
window.onload=function() {
obj=document.getElementById('c_d')
document.getElementById('click').onclick=function() {
if(test==0) {
ripOff();
}
}
}
function ripOff() {
test=1;
obj.firstChild.data=count;
obj.style.marginTop=200-h+'px';
obj.style.lineHeight=h+'px';
obj.style.fontSize=f+'px';

h-=10;
f--

if(h<0) {
h=200;
f=64;
count--;
}
if(count==0) {
clearTimeout(cd);
obj.firstChild.data=count;
obj.style.marginTop=0;
obj.style.lineHeight='200px';
obj.style.fontSize='64px';
count=10;
test=0;
return;
}
cd=setTimeout('ripOff()',50)
}
//]]>
</script>

</head>
<body>

<div id="click">start coundown</div>

<div id="container">
<div id="c_d">10</div>
</div>

</body>
</html>
coothead

Bengal313
09-01-2006, 10:00 PM
rlemon,

Are you referring to my site. Because using Firebox and 1280 res. Check out the jpg screen shot.

http://www.shumonhakim.com/siteview.jpg




It looks fine . What exactly do you mean.

As for exactly what I mean when I say page rip. I was looking for somethig that kinda emulates a page being ripped out of a notepad. Kinda ripped from the top and pulled downwards or upwards.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum