js 点不到我整蛊小游戏学习

<script>
var count=5;
var txt="^_^!来点我呀";
//获取随机数
function getnum (lowValue,highValue){
var choice=highValue-lowValue+1;
var rt=Math.floor(Math.random()*choice+lowValue);
return rt;
}


//获取控件左绝对位置
function getAbsoluteLeft(objectId) {
o = document.getElementById(objectId)
oLeft = o.offsetLeft            
while(o.offsetParent!=null) { 
oParent = o.offsetParent    
oLeft += oParent.offsetLeft 
o = oParent
}
return oLeft
}
//获取控件上绝对位置
function getAbsoluteTop(objectId) {
o = document.getElementById(objectId);
oTop = o.offsetTop;
while(o.offsetParent!=null)
{  
oParent = o.offsetParent 
oTop += oParent.offsetTop  // Add parent top position
o = oParent
}
return oTop
}


//获取控件宽度
function getElementWidth(objectId) {
x = document.getElementById(objectId);
return x.offsetWidth;
}
//获取控件高度
function getElementHeight(objectId) {
x = document.getElementById(objectId);
return x.offsetHeight;
}


function setdiv()//设置DIV坐标
{
txt="^_^!来点我呀";
document.getElementById('runbtn').value = txt;
var divChild = document.getElementById("myDiv2");
divChild.style.left=getnum(50,800);//因为offsetLeft是只读属性所以要通过left属性设置。而且还要设置绝对定位。
  divChild.style.top=getnum(50,600);//
  divChild.style.position="absolute";
}


function mousePosition(ev){ 
if(ev.pageX || ev.pageY){ 
return {x:ev.pageX, y:ev.pageY}; 

return { 
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, 
y:ev.clientY + document.body.scrollTop - document.body.clientTop 
}; 



function mouseMove(ev){ 
ev = ev || window.event; 
var mousePos = mousePosition(ev); 
var getdivx= getAbsoluteLeft("myDiv2");
var getdivy= getAbsoluteTop("myDiv2");
var bodersize=5;


if(mousePos.x>getdivx-bodersize&&mousePos.x<getdivx+getElementWidth("myDiv2")+bodersize&&mousePos.y>getdivy&&mousePos.y-bodersize<getdivy+getElementHeight("myDiv2")+bodersize)
{
    setdiv();
    count--;
    if(count==0)
    {
    txt="休息一下吧!";
document.getElementById('runbtn').value = txt;
    alert(txt);
    count=5;
    }
}



</script>
<div style="width:800px; height:600px;" id="myDiv" οnmοusemοve="mouseMove();" >
<div style="width:90px; height:30px;" id="myDiv2" >
  <input type="button" value="点我试试吧!" id="runbtn" οnclick="setdiv();" style="width:100%; height:100%;" />
</div>
</div>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值