LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code

STELLAR ZOOMOUT
CSS
body
{
  margin: 0;
  background:#000;
  overflow: hidden;
}
#mycanvas
{
  animation:cinematic 10s infinite ease-in-out;
  -webkit-filter:brightness(1)  saturate(0.9);
}
@-webkit-keyframes cinematic
{
  0%{transform:rotateZ(20deg);}
  75%{opacity:1;}
  100%{transform:rotateZ(-20deg);opacity:0;}
}
#text
{
  transform:translateY(-50%);
  top:50%;
  text-align:center;
  width:100%;
  position:absolute;
  color:rgba(255,255,255,0.5);
  font-family:"Open sans";
  font-weight:700;
  font-size:15px;
  whitespace:nowrap;
  letter-spacing:1.5em;
  animation:zoom 10s infinite linear;
}
@-webkit-keyframes zoom
{
  0%{
    opacity:0;
    transform:scale(0.5) translateY(-50%);
    -webkit-filter:blur(10px);
  }
  37.5%
  {
   opacity:1; transform:scale(1) translateY(-50%);
    -webkit-filter:none;
  }
  50%{
    -webkit-filter:none;
    opacity:1;
  }
  75%{
    opacity:0.3;
    transform:scale(1.5) translateY(-50%);
    -webkit-filter:blur(10px);
  }
  100%{
    opacity:0;
    transform:scale(2);
  }
}
JS
var c=document.getElementById('mycanvas'); 
var $=c.getContext('2d');
var t=0;
var image=document.getElementById('galaxy');
c.height=window.innerHeight;
c.width=window.innerWidth;
var w=window.innerWidth,h=window.innerHeight;
var arr=[];
var num=300;
var i=0;
	generate(700);
function generate(q)
{
	for (var i = 0; i 

Description

Watch a cinematic zoom out of deep space
Term
Sat, 01/13/2018 - 07:27

Related Codes

Pen ID
Pen ID
Pen ID
Square Adv