Team:Shenzhen BGIC ATCG
From 2013.igem.org
(Difference between revisions)
(12 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | <!-- | + | <!---------------------- |
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | + | Title: front.html | |
+ | Team: Shenzhen_BGIC_ATCG | ||
+ | Author: BGI_K2 | ||
+ | Twitter: @BGI_K2 | ||
+ | Email: im.ss.kk@gmail.com | ||
+ | Please contact me if you would like to use this script | ||
+ | ----------------------> | ||
- | + | <html lang="en"> | |
- | + | <meta name="baidu-tc-verification" content="4f1e64971af2f0274a13516d439abb07" /> | |
- | + | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/css/front.css?action=raw&ctype=text/css" media="screen" /> | |
- | + | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/css/display.css?action=raw&ctype=text/css" /> | |
- | + | <link rel="text/javascript" class="library" href="http://code.jquery.com/jquery-2.0.3.min.js?action=raw&ctype=text/javascript"" /> | |
- | < | + | <body> |
- | + | <div class="front"> | |
- | + | <ul class="front_navia front_navi"> | |
- | + | <li class="a1"> | |
- | + | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/stories"> | |
- | + | </a> | |
- | + | </li> | |
- | + | <li class="a2"> | |
- | < | + | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/modeling"> |
- | + | </a> | |
- | + | </li> | |
- | + | <li class="a3"> | |
- | + | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/results"> | |
- | + | </a> | |
- | + | </li> | |
- | + | <li class="a4"> | |
- | + | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/humanpractice"> | |
- | + | </a> | |
- | + | </li> | |
- | + | </ul> | |
- | + | <ul class="front_navib front_navi"> | |
+ | <li class="b1"> | ||
+ | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/team"> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li class="b2"> | ||
+ | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/parts"> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li class="b3"> | ||
+ | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/notes"> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li class="b4"> | ||
+ | <a href="https://2013.igem.org/Team:Shenzhen_BGIC_ATCG/safety"> | ||
+ | </a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | <div class="eye_wrapper" id="eyeballs"> | ||
+ | <img alt="Ball" class="eye-left" id="eye_left" src="https://static.igem.org/mediawiki/2013/a/ad/Eyeblack.png" > | ||
+ | <img alt="Ball" class="eye-right" id="eye_right" src="https://static.igem.org/mediawiki/2013/4/4c/Eyewhite.png" > | ||
+ | </div> | ||
+ | <script> | ||
+ | var getAngle = function(Xc, Yc, Xa, Ya, Xb, Yb) { | ||
+ | var v1x = Xb - Xc; | ||
+ | var v1y = Yb - Yc; | ||
+ | var v2x = Xa - Xc; | ||
+ | var v2y = Ya - Yc; | ||
+ | return 180 * (Math.atan2(v1x, v1y) - Math.atan2(v2x, v2y)) / Math.PI | ||
+ | }; | ||
+ | var left_center_offset = { | ||
+ | left: 412, | ||
+ | top: 488 | ||
+ | }, | ||
+ | right_center_offset = { | ||
+ | left: 530, | ||
+ | top: 488 | ||
+ | }, | ||
+ | radius2 = 20; | ||
+ | radius1 = 15; | ||
+ | var setEyeOffset = function(event) { | ||
+ | var offset = $(".eye_wrapper").offset(); | ||
+ | var x1 = offset.left + left_center_offset.left; | ||
+ | var y1 = offset.top + left_center_offset.top; | ||
+ | var x2 = offset.left + right_center_offset.left; | ||
+ | var y2 = offset.top + right_center_offset.top; | ||
+ | var n1 = event.clientX - x1; | ||
+ | var m1 = -(event.clientY - y1); | ||
+ | var k1 = Math.atan2(m1, n1); | ||
+ | var n2 = event.clientX - x2; | ||
+ | var m2 = -(event.clientY - y2); | ||
+ | var k2 = Math.atan2(m2, n2); | ||
+ | var x11 = (Math.cos(k1) * radius1 + x1).toFixed(0); | ||
+ | var y11 = (( - Math.sin(k1) * radius1) + y1).toFixed(0); | ||
+ | $(".eye-left").offset({ | ||
+ | left: x11, | ||
+ | top: y11 | ||
+ | }); | ||
+ | var x22 = (Math.cos(k2) * radius2 + x2).toFixed(0); | ||
+ | var y22 = (( - Math.sin(k2) * radius2) + y2).toFixed(0); | ||
+ | $(".eye-right").offset({ | ||
+ | left: x22, | ||
+ | top: y22 | ||
+ | }) | ||
+ | }; | ||
+ | $(window).mousemove(setEyeOffset); | ||
+ | </script> | ||
+ | </body> | ||
+ | </html> |
Latest revision as of 14:08, 26 September 2013