FADE IN EFFECT 5 - "CURTAIN FALLS"

The new page is being revealed from inside out - "the curtain falls" (for Internet Explorer; counterproductive with Mozilla Firefox). Please see another example for this effect (on our homepage):

Please copy the following code by pushing the below button and paste the copied code into the very beginning of the source code of your own homepage. In this code you can set the colours for this effect: change the HEX-Code (here: EEEE00) accordingly. Have a try!

<style type="text/css"> 
<!--
.intro{
position:absolute;left:0;top:0;
layer-background-color:EEEE00;
background-color:EEEE00;
border:0.1px EEEE00;}
--></style></p>
<div class="intro" id="i1"> </div>
<div class="intro" id="i2"> </div>
<div class="intro" id="i3"> </div>
<div class="intro" id="i4"> </div>
<div class="intro" id="i5"> </div>
<div class="intro" id="i6"> </div>
<div class="intro" id="i7"> </div>
<div class="intro" id="i8"> </div>
<script
language="JavaScript1.2">
var speed=20
var temp=new Array()
var temp2=new Array()
if (document.layers){
for (i=1;i<=2;i++){
temp[i]=eval("document.i"+i+".clip")
temp2[i]=eval("document.i"+i)
temp[i].width=window.innerWidth/2
temp[i].height=window.innerHeight
temp2[i].left=(i-1)*temp[i].width}}
else if (document.all){
var clipright=document.body.clientWidth/2,clipleft=0
for (i=1;i<=2;i++){
temp[i]=eval("document.all.i"+i+".style")
temp[i].width=document.body.clientWidth/2
temp[i].height=document.body.offsetHeight
temp[i].left=(i-1)*parseInt(temp[i].width)}}
function openit(){
window.scrollTo(0,0)
if (document.layers){
temp[1].right-=speed
temp[2].left+=speed
if (temp[2].left>window.innerWidth/2)
clearInterval(stopit)}
else if (document.all){
clipright-=speed
temp[1].clip="rect(0 "+clipright+" auto 0)"
clipleft+=speed
temp[2].clip="rect(0 auto auto "+clipleft+")"
if (clipright<=0)
clearInterval(stopit)}}
function gogo(){stopit=setInterval("openit()",100)}
gogo()
</script>

And now: enjoy tinkering!

FADE IN EFFECT 5 - "CURTAIN FALLS"

This page was last updated on: 22.05.2011