|
|
| Line 50: |
Line 50: |
| | </head> | | </head> |
| | <body> | | <body> |
| - |
| |
| - | <!--把下面代码加到<body>与</body>之间-->
| |
| - | <script LANGUAGE="JavaScript">
| |
| - | <!-- Begin
| |
| - | var ns = (document.layers)?1:0;
| |
| - | var imgwidth=40;
| |
| - | var imgheight=40;
| |
| - | var button = Array();
| |
| - | button[0]=new Image();
| |
| - | button[0].src="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | button[1]=new Image();
| |
| - | button[1].src="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | var text="<table width=10 bgcolor=#ffffff><td><a href='javascript:showhideAnimation()'><center><img name='Button' src='"+button[0].src+"' width='"+imgwidth+"' height='"+imgheight+"' border='0'></center></a></font></td></table>"
| |
| - | if (ns) {
| |
| - | document.write("<LAYER NAME='FlyOnOff' LEFT=0 TOP=0>"+text+"</LAYER>");
| |
| - | horz=".left";
| |
| - | vert=".top";
| |
| - | docStyle="document.";
| |
| - | styleDoc="";
| |
| - | innerW="window.innerWidth";
| |
| - | innerH="window.innerHeight";
| |
| - | offsetX="window.pageXOffset";
| |
| - | offsetY="window.pageYOffset";
| |
| - | }else {
| |
| - | document.write("<div id='FlyOnOff' style='position:absolute; visibility:show; left:235px; top:-50px; z-index:2'>"+text+"</div>");
| |
| - | horz=".pixelLeft";
| |
| - | vert=".pixelTop";
| |
| - | docStyle="";
| |
| - | styleDoc=".style";
| |
| - | innerW="document.body.clientWidth";
| |
| - | innerH="document.body.clientHeight";
| |
| - | offsetX="document.body.scrollLeft";
| |
| - | offsetY="document.body.scrollTop";
| |
| - | }
| |
| - | function checkLocation() {
| |
| - | objectXY="FlyOnOff";
| |
| - | var availableX=eval(innerW);
| |
| - | var availableY=eval(innerH);
| |
| - | var currentX=eval(offsetX);
| |
| - | var currentY=eval(offsetY);
| |
| - | x=availableX-(imgwidth+30)+currentX;
| |
| - | y=availableY-(imgheight+20)+currentY;
| |
| - | eval(docStyle + objectXY + styleDoc + horz + "=" + x);
| |
| - | eval(docStyle + objectXY + styleDoc + vert + "=" + y);
| |
| - | }
| |
| - | setInterval('checkLocation()', 10);
| |
| - | (document.layers)?window.captureEvents(Event.MOUSEMOVE):0;
| |
| - | (document.layers)?window.onMouseMove=getMousePosition:document.onmousemove=getMousePosition;
| |
| - |
| |
| - | var Dot_Ro=60;
| |
| - | var Dot_Theta=0;
| |
| - | var Dot_Speed;
| |
| - | var Dot_Direction=1;
| |
| - | var Dot_x=0;
| |
| - | var Dot_y=0;
| |
| - | var alpha;
| |
| - | var mult;
| |
| - | var picX = 20;
| |
| - | var picY = 100;
| |
| - | var mouseX = 0;
| |
| - | var mouseY = 0;
| |
| - | var step = 10;
| |
| - | var speed = 100;
| |
| - | var dir = Array();
| |
| - | dir[-4]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[-1]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[-2]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[-3]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[3]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[4]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[1]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[2]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | dir[0]="https://static.igem.org/mediawiki/2014/0/0d/Bnu_IGEMsmall.png";
| |
| - | var img = Array();
| |
| - | for (var i=-4; i<5; i++){
| |
| - | img[i]=new Image();
| |
| - | img[i].src=""+dir[i];
| |
| - | }
| |
| - | if (ns) {
| |
| - | document.write("<LAYER NAME='FlyDiv' LEFT=0 TOP=0><img src="+img[1].src+" name='pic'></LAYER>");
| |
| - | }else {
| |
| - | document.write("<div id='FlyDiv' style='position:absolute'>");
| |
| - | document.write("<img name='pic' src=" + img[1].src + "></div>");
| |
| - | }
| |
| - | function display(direction) {
| |
| - | if (ns) {
| |
| - | document.pic.src = img[direction].src;
| |
| - | }else{
| |
| - | pic.src = img[direction].src;
| |
| - | }
| |
| - | }
| |
| - | function getMousePosition(e) {
| |
| - | mouseY=(ns)?e.pageY:window.event.y + document.body.scrollTop;
| |
| - | mouseX=(ns)?e.pageX:window.event.x + document.body.scrollLeft;
| |
| - | }
| |
| - | function calcNewPos() {
| |
| - | var dist=Math.sqrt(Math.pow(mouseY-picY,2) + Math.pow(mouseX-picX,2));
| |
| - | Dot_Speed=Math.PI/15;
| |
| - | Dot_Theta+=Dot_Direction*Dot_Speed;
| |
| - | Dot_x=mouseX+Dot_Ro*Math.cos(Dot_Theta);
| |
| - | Dot_y=mouseY+Dot_Ro*Math.sin(Dot_Theta);
| |
| - | var arg = (Dot_y-picY) / (Dot_x-picX);
| |
| - | mult = (Dot_x - picX < 0)? mult = -1:1;
| |
| - | alpha = Math.atan(arg);
| |
| - | var dx = mult * step * Math.cos(alpha);
| |
| - | var dy = mult * step * Math.sin(alpha);
| |
| - | picX += dx;
| |
| - | picY += dy;
| |
| - | }
| |
| - | function showhideAnimation() {
| |
| - | if (ns) {
| |
| - | document.layers['FlyDiv'].visibility=document.layers['FlyDiv'].visibility=="hide"?"show":"hide";
| |
| - | document.Button.src = document.layers['FlyDiv'].visibility=="hide"?button[1].src:button[0].src;
| |
| - | }else {
| |
| - | FlyDiv.style.visibility=="hidden"?FlyDiv.style.visibility = "visible":FlyDiv.style.visibility = "hidden";
| |
| - | Button.src = FlyDiv.style.visibility=="hidden"?button[1].src:button[0].src;
| |
| - | }
| |
| - | }
| |
| - | function gs9768() {
| |
| - | calcNewPos();
| |
| - | if (ns) {
| |
| - | document.layers['FlyDiv'].left = picX;
| |
| - | document.layers['FlyDiv'].top = picY;
| |
| - | }else{
| |
| - | FlyDiv.style.left = picX - pic.width / 2;
| |
| - | FlyDiv.style.top = picY - pic.height / 2;
| |
| - | }
| |
| - | alpha=-180*alpha/Math.PI;
| |
| - | alpha+=22.5;
| |
| - | var OK=0;
| |
| - | for(var i=0; (i<4)&& !OK; i++){
| |
| - | if (alpha<-Math.PI+45*i){
| |
| - | display(mult*(i+1));
| |
| - | OK=1;
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | function ChangeDotDirection() {
| |
| - | Dot_Direction=-Dot_Direction;
| |
| - | Dot_Theta+=Math.PI;
| |
| - | }
| |
| - | setInterval('gs9768()', speed);
| |
| - | setInterval('ChangeDotDirection()', speed*50);
| |
| - | // End -->
| |
| - | </script>
| |
| - | </body>
| |
| - |
| |
| | | | |
| | <!-- Fullscreen backgrounds --> | | <!-- Fullscreen backgrounds --> |
"
