作者：windy2000 時(shí)間： 2003-11-27 文檔類型：原創(chuàng) 來自：藍(lán)色理想
一個(gè)很不錯(cuò)的效果，用鍵盤的箭頭鍵控制一個(gè)漂亮的箭頭！也許能給你啟發(fā)，做出一款有趣的小游戲呢！
運(yùn)行代碼框<html xmlns:v="urn:schemas-microsoft-com:vml"> <head> <title>Interactive Arrow</title> <STYLE> v\:* { BEHAVIOR: url(#default#VML) } </STYLE> <SCRIPT Language="JavaScript"> /* All Files are Designed & Writen by Windy_sk, you can use it freely but ... YOU MUST KEEP THIS ITEM ! Email: seasonx@163.net */ var timer = null; var time_unit = 30; var A_speed = 10; var L_speed = 15; var move_x, move_y; function ArrowStyle(type,color,color2,focus){ if(color == "") color = "white"; if(color2 == "") color2 = "white"; this.type = type; this.color = color; this.color2 = color2; this.focus = focus; } var style_list = new Array(); style_list[style_list.length] = new ArrowStyle("gradient","blue","",""); style_list[style_list.length] = new ArrowStyle("gradient","","blue",""); style_list[style_list.length] = new ArrowStyle("gradient","blue","red",""); style_list[style_list.length] = new ArrowStyle("gradient","red","blue",""); style_list[style_list.length] = new ArrowStyle("gradient","blue","red","50%"); style_list[style_list.length] = new ArrowStyle("gradient","red","blue","-50%"); style_list[style_list.length] = new ArrowStyle("gradientradial","","blue",""); style_list[style_list.length] = new ArrowStyle("gradientradial","blue","",""); style_list[style_list.length] = new ArrowStyle("gradientradial","red","blue",""); style_list[style_list.length] = new ArrowStyle("gradientradial","blue","red",""); style_list[style_list.length] = new ArrowStyle("gradientradial","red","blue","50%"); style_list[style_list.length] = new ArrowStyle("gradientradial","blue","red","-50%"); function ChangeStyle(){ if(style_list.length == 0) return; var the_style = style_list[GetRandomNum(1,style_list.length) - 1]; fill.type = the_style.type; fill.color = the_style.color; fill.color2 = the_style.color2; fill.focus = the_style.focus; } /* function ChangeStyle(){ fill.type = GetRandomNum(0,1)?"gradient":"gradientradial"; fill.color = GetRandomdColor(); fill.color2 = GetRandomdColor(); fill.focus = GetRandomNum(0,1)?"+":"-" + GetRandomNum(0,100).toString() + "%"; } function GetRandomdColor(){ var result = ""; var hex = new Array(6); hex[0] = "FF"; hex[1] = "CC"; hex[2] = "99"; hex[3] = "66"; hex[4] = "33"; hex[5] = "00"; for(var i=0;i<3;i++){ result += hex[GetRandomNum(0,5)]; } return result; } */ function GetRandomNum(Min,Max){ var Range = Max - Min; var Rand = Math.random(); return(Min + Math.round(Rand * Range)); } function MoveIt(){ var the_top = parseInt(angle.style.top); var the_left = parseInt(angle.style.left); angle.style.top = the_top + move_y; angle.style.left = the_left + move_x; if(the_top < 0 || the_top > document.body.offsetHeight){ angle.Rotation = 180 - angle.Rotation; move_y = -move_y; angle.style.top = the_top<0 ? 0 : document.body.offsetHeight + move_y; } if(the_left < 0 || the_left > document.body.offsetWidth){ angle.Rotation = 360 - angle.Rotation; move_x = -move_x; angle.style.left = the_left<0 ? 0 : document.body.offsetWidth + move_x; } } document.onkeydown = function(){ angle.Rotation = angle.Rotation % 360; if(timer!=null) return; var the_angle = Math.PI * angle.Rotation / 180; switch(event.keyCode){ case 37: //left timer = setInterval("angle.Rotation -= A_speed",time_unit); break; case 39: //right timer = setInterval("angle.Rotation += A_speed",time_unit); break; case 40: //down the_angle += Math.PI; case 38: //up move_y = -Math.floor(L_speed * Math.cos(the_angle)); move_x = +Math.floor(L_speed * Math.sin(the_angle)); timer = setInterval("MoveIt()",time_unit); break; } return; } document.onkeyup = function(){ if(timer!=null) clearInterval(timer); timer = null; } document.onclick = function(){ ChangeStyle(); } document.onmousewheel = function(){ if (event.wheelDelta >= 120){ angle.style.width = Math.ceil(parseInt(angle.style.width) * 1.1); angle.style.height = Math.ceil(parseInt(angle.style.height) * 1.1); }else if (event.wheelDelta <= -120){ angle.style.width = Math.ceil(parseInt(angle.style.width) * 0.9); angle.style.height = Math.ceil(parseInt(angle.style.height) * 0.9); } return; } window.onload = function(){ setInterval("window.status='Rotation: '+angle.Rotation+'; Top: '+angle.style.top+'; Left: '+angle.style.left",time_unit); } </SCRIPT> </head> <body scroll="no"> <v:group id="angle" style='position:absolute;top:0;left:0;width:20;height:20;z-index:999' coordorigin="-10,-10" coordsize="20,20"> <v:shape CoordOrig="-10,-10" CoordSize="20,20" style="width:20;height:20" Title="Interactive Arrow" FillColor="red" Filled="true" StrokeColor="black" StrokeWeight="1pt"> <v:Stroke StrokeColor="black" StrokeWeight="1pt" /> <v:fill id=fill type='gradient' color='blue'/> <v:Path v="m 0,-10 l -10,10 l 0,5 l 10,10 x e" /> </v:shape> </v:group> </body> </html> [Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
出處：藍(lán)色理想 責(zé)任編輯：紅色黑客
◎進(jìn)入論壇網(wǎng)頁制作、網(wǎng)站綜合版塊參加討論
藍(lán)色理想版權(quán)申明：除部分特別聲明不要轉(zhuǎn)載，或者授權(quán)我站獨(dú)家播發(fā)的文章外，大家可以自由轉(zhuǎn)載我站點(diǎn)的原創(chuàng)文章，但原作者和來自我站的鏈接必須保留（非我站原創(chuàng)的，按照原來自一節(jié)，自行鏈接）。文章版權(quán)歸我站和作者共有。
轉(zhuǎn)載要求：轉(zhuǎn)載之圖片、文件，鏈接請不要盜鏈到本站，且不準(zhǔn)打上各自站點(diǎn)的水印，亦不能抹去我站點(diǎn)水印。
特別注意：本站所提供的攝影照片，插畫，設(shè)計(jì)作品，如需使用，請與原作者聯(lián)系，版權(quán)歸原作者所有，文章若有侵犯作者版權(quán)，請與我們聯(lián)系，我們將立即刪除修改。
