CSS Codes
CSS Layouts

<html>
<head>
<style>
<!--
.intro{
position:fixed;
left:0;
top:0;
layer-background-color:green;
background-color:green;
border:0.1px solid green;
z-index:10;
}
-->
</style>
</head>

<body>
<div id="i1" class="intro"></div><div id="i2" class="intro"></div><div id="i3"
class="intro"></div><div id="i4" class="intro"></div><div id="i5" class="intro"></div><div
id="i6" class="intro"></div><div id="i7" class="intro"></div><div id="i8" class="intro"></div>
<script language="JavaScript1.2">

/*
Top-Down Curtain Script- (c) Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more free DHTML scripts, and TOS,
visit http://www.dynamicdrive.com
*/


var speed=20
var temp=new Array()
var temp2=new Array()

var clipbottom=(window.innerHeight)?window.innerHeight:document.body.offsetHeight
cliptop=0
for (i=1;i<=8;i++){
temp[i]=document.getElementById("i"+i).style
temp[i].width=(window.innerWidth)?window.innerWidth/8-2 + 'px':document.body.clientWidth/8 + 'px'
temp[i].height=(window.innerWidth)?window.innerHeight + 'px':document.body.offsetHeight + 'px'
temp[i].left=(i-1)*parseInt(temp[i].width) + 'px'
}

function openit(){

clipbottom-=speed
for (i=1;i<=8;i=i+2){
temp[i].clip="rect(0 auto "+clipbottom+"px 0)"
}
cliptop+=speed
for (i=2;i<=8;i=i+2){
temp[i].clip="rect("+cliptop+"px auto auto auto)"
}
if (clipbottom<=0){
for (i=1;i<=8;i++)
temp[i].display="none"
clearInterval(stopit)
}
}
function gogo(){
stopit=setInterval("openit()",100)
}
gogo()
</script>

</body>
</html>