Javascript JQuery游戏，元素在与另一个元素接触时消失

我正在用jquery创建一个游戏，游戏的意思是，你应该用一个元素（在本例中是一个桶“#spelare”）捕捉从上面掉下来的其他元素“.food”。我怎样才能使落下的元素接触（桶）时消失，你得到1分

提前感谢所有我能得到的帮助

这是我在atm机上的代码：

正文{
文本对齐：居中；
背景色：黑色；
}
#斯佩尔普兰{
宽度：1000px；
高度：610px；
位置：绝对位置；
左边距：460像素；
盒影：嵌入0px 0px 50px；
背景颜色：绿色；
}
#斯佩拉尔{
宽度：110px；
高度：12vh；
位置：相对位置；
顶部：53.4vh；
背景图片：url（hink.png）；
背景尺寸：封面；
}
.食物{
宽度：50px；
高度：50px；
位置：绝对位置；
背景图片：url（vattendroppe.png）；
背景尺寸：封面；
显示：块；
}
p{
位置：相对位置；
字体系列：“Electralize”，无衬线；
}
#波昂{
颜色：白色；
底部：17vh；
右：45%；
}
#丽芙{
颜色：白色；
底部：18vh；
右：46.5%；
}
法心先生{
颜色：红色；
底部：21.5vh；
右：43.5%；
位置：相对位置；
}
#信息{
颜色：白色；
字体系列：“Electralize”，无衬线；
边际上限：68vh；
}

jqueryspel
$（文档）.ready（函数（）{
$（文档）.keydown（函数（e）{
如果（e.keyCode==39&&$（“#spelare”）.css（“左”）<'880px'）
$（“#spelare”）.animate（{left:'+=20px'}，0）；
else if（e.keyCode==37&&$（“#spelare”）.css（“左”）>“0px”）
$（“#spelare”）.animate（{left:'-=20px'}，0）；
});
设定时间间隔（2000年）；
设置间隔（下降，0）；
});
功能性食物（）{
var spelplanWidth=$（'#spelplan'）.width（）；
var randPosX=Math.floor（（Math.random（）*spelplanWidth））；
var元素=$（“”）.css（'left'，randPosX）.css（'bottom'，'446px'）；
$（“#spelplan”）。追加（元素）；
}
函数fall（）{
var elementFall=$（“.food”）.animate（{top:'+=20px'}，500）；
$（“#spelplan”）.append（elementFall）；
}
jqueryspel
poäng:
liv：
仪器管理员：
斯佩莱·går ut påatt du med hjälp av hinken och pillerner ska fånga alla vattendroppar
在我40岁的时候，我的妻子是瓦坦德罗帕·斯弗罗拉

您必须经常比较每个下落元件位置与铲斗位置

一个很好的地方就是你的

fall（）

函数。
看一看

$（文档）.ready（函数（）{
var得分=0；
var=0；
//铲斗运动
$（文档）.keydown（函数（e）{
//console.log（e.which）；
//如果键盘向左或向右箭头
如果（e.keyCode==39&&$（“#spelare”）.css（“左”）<'880px'）
$（“#spelare”）.animate（{left:'+=20px'}，0）；
else if（e.keyCode==37&&$（“#spelare”）.css（“左”）>“0px”）
$（“#spelare”）.animate（{left:'-=20px'}，0）；
});
//游戏初始化
var spanfoodInterval=setInterval（spawnFood，2000年）；
var fallInterval=setInterval（fall，0）；
//加水
功能性食物（）{
var spelplanWidth=$（'#spelplan'）.width（）；
var randPosX=Math.floor（（Math.random（）*spelplanWidth））；
var元素=$（“”）.css（'left'，randPosX）.css（'bottom'，'446px'）；
$（“#spelplan”）。追加（元素）；
}
//拖放对象动画
函数fall（）{
var elementFall=$（“.food”）.animate（{top:'+=20px'}，500）；
//$（“#spelplan”）.append（elementFall）；
$（“.food”）。每个（功能）{
if（typeof（$（this））！=“未定义”和&typeof（$（“#spelare”））！=“未定义”）{
//项目位置
var thisPosition=$（this.position（）；
var thisWidth=$（this）.width（）；
//铲斗位置和宽度
var bucketPosition=$（“#spelare”）.position（）；
var bucketWidth=$（“#spelare”）.width（）；
var bucketHeight=$（“#spelare”）.height（）；
//如果物体和铲斗在同一位置
如果（thisPosition.top>=bucketPosition.top
&&thisPosition.left>=bucketPosition.left
&&thisPosition.left=bucketPosition.top+BucketEight）{
$（this.remove（）；
失败++；
//console.log（“FAILS:+FAILS”）；
}
//如果超过3次失误=>游戏结束。
如果（失败>3）{
$（“#failMsg”）.show（）；
$（“#spelare”）.remove（）；
$（“.food”）.remove（）；
净空间隔（spanfoodInterval）；
清除间隔（下降间隔）；
}
}
});
}
}); // 就绪

正文{
文本对齐：居中；
背景色：黑色；
}
#斯佩尔普兰{
宽度：1000px；
高度：610px；
位置：绝对位置；
左边距：460像素；
盒影：嵌入0px 0px 50px；
背景颜色：绿色；
}
#斯佩拉尔{
宽度：110px；
高度：12vh；
位置：相对位置；
顶部：53.4vh；
背景图片：url(https://placehold.it/350x150)；/*hink.png）*/
背景尺寸：封面；
}
.食物{
宽度：50px；
高度：50px；
位置：绝对位置；
背景图片：url(https://placehold.it/350x150)；/*vattendrope.png）*/
背景尺寸：封面；
显示：块；
}
p{
位置：相对位置；
字体系列：“Electralize”，无衬线；
}
#失败消息{
位置：固定；
最高：50%；
左：50%；
转换：翻译（50%50%）；
颜色：白色；
字号：4em；
显示：无；
}

jQuery游戏-你的分数：0