點擊重疊圖像

我正在嘗試創建一個點球遊戲。用戶可以點擊圖像來顯示他們認爲球是在哪裏。我有它的工作，但如果你想點擊兩個相對接近的點，你不能作爲其選擇以前的圖像..點擊重疊圖像

有沒有辦法實現這一點，我正在考慮把一個透明的圖像上方，所以他們不可選擇，但我不能得到它的工作。

這是我迄今爲止

2010-11-28 Josh Crowder

這可能是一件好事，不能讓他們接他們，如果他們靠得太近。如果您爲每次點擊收取費用，我無法想象有人有意挑選僅在彼此像素內的兩個點。

但是，可能會在圖像上放置透明的div，並將十字線圖像放在其下。這對我有效...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
</head> 
<body> 
    <div id="divSource" style="position:relative;width:500px;"> 
     <img src="http://chelseavets.org.uk/Gallery/090228vBBC/SpotTheBall.JPG" width="100%" /> 
     <div id="divTarget" style="position:absolute;left:0;top:0;width:100%;height:100%;border:solid 1px red;z-index:100;"></div> 
    </div> 
<script src="Scripts/jquery-1.4.2.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(function() { 
     $('#divTarget').click(function (e) { 
      var target = $('<div></div>'); 
      target.css({ 
       position: 'absolute', 
       backgroundImage: 'url(http://enjoythespace.com/sites/game/img/cross.png)', 
       width: '29px', 
       height: '27px', 
       top: e.offsetY - 14 + 'px', 
       left: e.offsetX - 15 + 'px', 
       padding: 0, 
       margin: 0, 
       zIndex: 50 
      }); 
      $('#divSource').append(target); 
     }); 
    }); 
</script> 
</body> 
</html>

來源

2010-11-28 04:22:54 Brian

點擊重疊圖像

回答

相關問題