Skip to content

Instantly share code, notes, and snippets.

@comoc
Created August 24, 2013 03:23
Show Gist options
  • Save comoc/6325873 to your computer and use it in GitHub Desktop.
Save comoc/6325873 to your computer and use it in GitHub Desktop.
html, body {
margin:0;
padding:0;
height:100%;
}
html {
background:-webkit-linear-gradient(left, #000, #fff);
background: -moz-linear-gradient(left, #000, #fff);
background: -o-linear-gradient(left, #000, #fff);
}
body {
background:-webkit-linear-gradient(top, #fff, #000);
background: -moz-linear-gradient(top, #fff, #000);
background: -o-linear-gradient(top, #fff, #000);
animation: anime 3s ease alternate infinite;
-webkit-animation: anime 3s ease alternate infinite;
-moz-animation: anime 3s ease alternate infinite;
-o-animation: anime 3s ease alternate infinite;
}
@keyframes anime {
0% { display:none; opacity: 0; }
100% { display:block; opacity: 1; }
}
@-webkit-keyframes anime {
0% { display:none; opacity: 0; }
100% { display:block; opacity: 1; }
}
@-moz-keyframes anime {
0% { display:none; opacity: 0; }
100% { display:block; opacity: 1; }
}
@-o-keyframes anime {
0% { display:none; opacity: 0; }
100% { display:block; opacity: 1; }
}
/* body:hover {
opacity:0;
} */
<!DOCTYPE html>
<html>
<head>
<meta name="bganim" content="CSS3 background animation" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment