你这个问题，之前我已回答过了，有个知道的朋友提了跟你现在基本一样的问题，给你个链接吧
创新互联公司是一家专注网站建设、网络营销策划、微信小程序开发、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立十年以来，已经为近1000家成都酒楼设计各业的企业公司提供互联网服务。现在，服务的近1000家客户与我们一路同行，见证我们的成长；未来，我们一起分享成功的喜悦。
[img]JS
反弹心法
是你攻击越高反弹伤害越高
心法
只要玩家
或怪攻击你
你就会100%反击的
JS
配个
高反
打架厉害
谢谢
JS穿加什么的衣服主要看玩家平时主要做什么吧，如果经常和人PK最好穿荆棘的，如果只是打下怪升下级还是穿加血的好（穿荆棘的不会为了反怪吧）。还有大家说到的低级点还是血衣好，现在高血都便宜，3个就+1200血了。至于你的这件装备，价格也就100左右，110W还是可以的，用到50级换新装都挺不错的。
!DOCTYPE HTML
html
head
meta charset=utf-8 /
titleUFO来了/title
script src="jQuery/js/jquery-1.11.3.min.js"/script
script
$(function() {
var i = j = 10;
var e = $("#target");
var win = $(window);
function intern() {
var width = e.width();
var height = e.height();
var left = parseInt(e.css("left"));
var top = parseInt(e.css("top"));
var windowWidth = win.width();
var windowHeight = win.height();
if (windowWidth - width (left + i)) {
i = -i;
} else if ((left + i) 0) {
i = -i;
}
if (windowHeight - height (top + j)) {
j = -j;
碰壁反弹这个效果真的是挺有趣的，看起来就比较的高大上，而且写碰壁反弹成功后，也就能做些网页小游戏了。虽然这么说，但其实这个效果并不难写。只是坑比较的多，很多工作多年的程序员都可能会陷进去。
废话不多说，我们写起来：
1.CSS文件：
style
body{
border-style: solid;
border-color: sliver;
border-width: 5px;
margin-left: 100px;
width:1000px;
height:800px;
}
#screen{
width:800px;
height:600px;
background-color:#272822;
position:relative;
left:100px;
top:100px;
}
#egg{
width:50px;
height:50px;
background-color:red;
position:relative;
}
/style
2.body内容：
body
div id="screen"
div id="egg"
/div
/div
/body
3.JavaScript脚本：
var eggX=0;
var eggY=0;
var directX=1;
var directY=1;
function test(){
eggX+=directX;
eggY+=directY;
egg.style.left=eggX+"px";
egg.style.top=eggY+"px";
if(eggX+egg.offsetWidth=document.getElementById("screen").clientWidth||eggX=0) {
directX=-directX;
}
if(eggY+egg.offsetHeight=document.getElementById("screen").clientHeight||eggY=0){
directY=-directY;
}
}
setInterval("test()",1);
说明：拷贝代码，我们就能看到一个碰壁反弹的方框了。当然如果想要换成图片，直接将div里的内容换掉就OK了。不过这样似乎太美水准了点，在这附上完整代码（有障碍物的）：
!DOCTYPE html
html
head
meta http-equiv="content-type" content="text/html; charset=UTF-8"
title碰壁反弹/title
style
body{
border-style: solid;
border-color: sliver;
border-width: 5px;
margin-left: 100px;
width:1000px;
height:800px;
}
#screen{
width:800px;
height:600px;
background-color:#272822;
position:relative;
left:100px;
top:100px;
}
#egg{
width:50px;
height:50px;
background-color:red;
position:relative;
}
#cock{
position:relative;
left:200px;
top:200px;
width:200px;
height:30px;
background-color: blue;
cursor: pointer;
}
/style
/head
body
div id="screen"
div id="egg"
/div
div id="cock" onmousedown="startDrag(this)" onmousemove="drag(this)" onmouseup="stopDrag(this)"
/div
/div
/body
script type="text/javascript"
var eggX=0;
var eggY=0;
var directX=1;
var directY=1;
function test(){
eggX+=directX;
eggY+=directY;
egg.style.left=eggX+"px";
egg.style.top=eggY+"px";
if(eggX+egg.offsetWidth=document.getElementById("screen").clientWidth||eggX=0) {
directX=-directX;
}
if(eggY+egg.offsetHeight=document.getElementById("screen").clientHeight||eggY=0){
directY=-directY;
}
if(eggY+egg.offsetHeight=document.getElementById("cock").offsetTop(eggX+egg.offsetWidth=200eggX+egg.offsetWidth=400)){
directY=-directY;
}
if((eggY-30)=document.getElementById("cock").offsetTop(eggX+egg.offsetWidth=200eggX+egg.offsetWidth=400)){
directY=-directY;
}
}
setInterval("test()",1);
/script
/html
