<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
*{margin:0; padding:0;
}
#main{width:1000px; height:600px; position:relative; background:#CCC; margin:20px auto;
}
.box{width:200px; height:200px; position:absolute; font-size:100px; font-family:'微软雅黑'; text-align:center; line-height:200px;
}
.one{left:50px; top:50px; background:red;
}
.two{right:50px; top:50px; background:green;
}
.three{left:50px; bottom:50px; background:blue;
}
.four{right:50px; bottom:50px; background:yellow;
}
</style>
<script>
window.onload=function()
{
var oDiv=document.getElementById('main');
var aDiv=oDiv.getElementsByTagName('div');
var a=10;
for(var i=0;i<aDiv.length;i++)
{
aDiv[i].index=i;
aDiv[i].onmousedown=function(ev)
{
var result=[];
arr=[];
var Num=0;
var oEvent=ev||event;
var DownX=this.offsetLeft;
var DownY=this.offsetTop;
var disX=oEvent.clientX-this.offsetLeft;
var disY=oEvent.clientY-this.offsetTop;
for(var i=0;i<aDiv.length;i++)
{
var json={
l:aDiv[i].offsetLeft,
r:aDiv[i].offsetLeft+aDiv[i].offsetWidth,
t:aDiv[i].offsetTop,
b:aDiv[i].offsetTop+aDiv[i].offsetHeight
}
arr.push(json)
}
this.style.zIndex=a++;
Num=this.index;
document.onmousemove=function(ev)
{
result=[];
var oEvent=ev||event;
aDiv[Num].style.left=oEvent.clientX-disX+'px';
aDiv[Num].style.top=oEvent.clientY-disY+'px';
if(aDiv[Num].offsetLeft<0)
{
aDiv[Num].style.left=0;
}
else if(aDiv[Num].offsetLeft>oDiv.clientWidth-aDiv[Num].clientWidth)
{
aDiv[Num].style.left=oDiv.clientWidth-aDiv[Num].clientWidth+'px';
}
if(aDiv[Num].offsetTop<0)
{
aDiv[Num].style.top=0;
}
else if(aDiv[Num].offsetTop>oDiv.clientHeight-aDiv[Num].clientHeight)
{
aDiv[Num].style.top=oDiv.clientHeight-aDiv[Num].clientHeight+'px';
}
l=aDiv[Num].offsetLeft;
r=aDiv[Num].offsetLeft+aDiv[Num].offsetWidth;
t=aDiv[Num].offsetTop;
b=aDiv[Num].offsetTop+aDiv[Num].offsetHeight;
for(var i=0;i<arr.length;i++)
{
if(i==Num)
{
result.push(false)
continue;
}
else
{
if(l>arr[i].r || r<arr[i].l || t>arr[i].b || b<arr[i].t)
{
result.push(false)
}
else
{
result.push(true)
for(var c=0;c<aDiv.length;c++)
{
aDiv[c].style.opacity='1';/*非IE*/
aDiv[c].style.filter='alpha(opacity='+100+')';/*IE*/
}
aDiv[i].style.opacity='0.3';/*非IE*/
aDiv[i].style.filter='alpha(opacity='+30+')';/*IE*/
break;
}
}
}
};
document.onmouseup=function()
{
document.onmousemove=null;
document.onmouseup=null;
for(var c=0;c<aDiv.length;c++)
{
aDiv[c].style.opacity='1';/*非IE*/
aDiv[c].style.filter='alpha(opacity='+100+')';/*IE*/
}
var time=0;
for(var i=0;i<arr.length;i++)
{
if(i==Num)
{
continue;
}
else
{
if(l>arr[i].r || r<arr[i].l || t>arr[i].b || b<arr[i].t)
{
time++
}
}
}
if(time==arr.length-1)
{
aDiv[Num].style.left=DownX+'px';
aDiv[Num].style.top=DownY+'px';
}
for(var i=0;i<result.length;i++)
{
if(result[i])
{
aDiv[Num].style.left=aDiv[i].offsetLeft+'px';
aDiv[Num].style.top=aDiv[i].offsetTop+'px';
aDiv[i].style.left=DownX+'px';
aDiv[i].style.top=DownY+'px';
}
}
javascript 抓娃娃小游戏H5完整版
2星 需积分: 50 4 浏览量
2017-12-18
15:01:20
上传
评论 6
收藏 3.24MB RAR 举报 
baby.rar （31个子文件） 
baby 
.project 1KB trunk css swiper.min.css 19KB pace-theme-loading-bar.css 9KB public.css 1KB index.css 5KB images 
pole.png 961B pic03.png 3KB bgm.mp3 2.91MB boy.png 28KB paw_set.png 21KB topIcon.png 5KB pic02.png 3KB pic04.png 3KB bum.png 7KB
bg.jpg 15KB sou.mp3 8KB gx.png 139KB paw_close.png 24KB pic01.png 3KB
pengzhuang.html 3KB index.html 7KB js jquery.min.js 90KB pace.js 26KB index.js 3KB swiper.min.js 109KB fastclick.js 25KB underscore.js 51KB velocity.js 197KB Adaptive.js 4KB pengzhuangjiance.html 9KB zhuazi.html 8KB资源评论
伟大的虫子2017-12-27不要下，垃圾。抓不了，响应慢，无体验
tukaliu2017-12-29确实不能用，所要的分值太不值了，完全不能用。
哲哲9852018-01-22还好，做部份参考！
