Div命中检测

时间:2016-06-24 20:27:06

标签: javascript jquery html css

我需要javascript中的点击检测帮助。我尝试了很多脚本,但它们都不起作用。
我目前的代码:

function collision($div1, $div2) {
 // nothing, this is where my collision detection needs to be
}

我的divs:

<style>
/* CSS */
/* character */
#character {
  position:absolute;
}

/* masses */
#bluemass {
  position:absolute;
}
</style>
<center>
<div class="bluemass" id="bluemass">
    <img src='./pic/bluemass.png' height='35' width='35' />
</div> </center>
<div class="character" id="character">

<img src="./pic/char.png" alt="info" height="90" width="90" />

<br>

<? 

   $v = $_GET["username"]; 

   echo "<div style ='font:21px/21px Courier,tahoma,sans-serif;'>$v</div>";

?>



<?

   echo "<div style ='font:21px/21px Courier,tahoma,sans-serif;'>$mass</div>";

?>
</div>

我如何检测div字符是否与div bluemass碰撞/重叠?在此先感谢,this是我的测试网站。

1 个答案:

答案 0 :(得分:0)

您可以从以下内容开始:

function collision($div1, $div2) {

 //
 var rect1={
  "top":$div1.offset().top,
  "left":$div1.offset().left,
  "width":$div1.offset().width(),
  "height":$div1.offset().height()
 };
 var rect2={
  "top":$div2.offset().top,
  "left":$div2.offset().left,
  "width":$div2.offset().width(),
  "height":$div2.offset().height()
 };

 // Standard rect-overlap checking code here

}

我不会称这是一个完整的解决方案,因为我知道你需要另外考虑某些其他的东西,比如页边距/填充/等等,但希望这会让你开始。