diff options
| author | Kyle K <kylek389@gmail.com> | 2013-07-10 01:42:04 -0500 |
|---|---|---|
| committer | Kyle K <kylek389@gmail.com> | 2013-07-10 01:42:04 -0500 |
| commit | e6956acf7d09cc2353134f16e4ac33bd3cb71e5a (patch) | |
| tree | 36013b42b3e83b5be594f9b2a7aefc082acf8a56 /kanebros-logo.xhtml | |
| parent | f5f461aaf9f08951fa3990e49b51a076f7036b16 (diff) | |
| download | websandbox-e6956acf7d09cc2353134f16e4ac33bd3cb71e5a.tar.gz websandbox-e6956acf7d09cc2353134f16e4ac33bd3cb71e5a.tar.bz2 websandbox-e6956acf7d09cc2353134f16e4ac33bd3cb71e5a.zip | |
logo animation
Diffstat (limited to 'kanebros-logo.xhtml')
| -rw-r--r-- | kanebros-logo.xhtml | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/kanebros-logo.xhtml b/kanebros-logo.xhtml new file mode 100644 index 0000000..9647c82 --- /dev/null +++ b/kanebros-logo.xhtml @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" +"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>hello, world!</title> +<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> +<style type="text/css"> +body { + background-color: black; +} +#logo { + position: relative; + width: 600px; + height: 400px; + border: 2px solid white; + margin: 10px +} +#ltear, #rtear { + position: absolute; +} +#logo img { + height: 30%; + width: 30%; +} +#rtear { + margin-top: 25px; + margin-left: 200px; + +} +</style> +<script type="text/javascript" src="jquery-1.10.1.min.js"></script> +<script type="text/javascript"> +<![CDATA[ + $(function() { + $("#rtear").animate({'margin-left': 100}, 1000); + $("#ltear").animate({'margin-left': 100}, 1000, function() { + $("#logo").animate({ + '-webkit-transform': 'rotate(90deg)', + '-moz-transform': 'rotate(90deg)', + '-ms-transform': 'rotate(90deg)', + '-o-transform': 'rotate(90deg)', + 'transform': 'rotate(90deg)', + 'zoom': 1 + }, 5000); + }); + }); +]]> +</script> +</head> +<body> +<div id="logo"> + <div id="ltear"><img src="kane-logo/ltear.png" alt="" /></div> + <div id="rtear"><img src="kane-logo/rtear.png" alt="" /></div> +</div> +</body> +</html> + |