透明區域周圍的圓角阻擋徘徊

Question

我有一些設置，看起來有點像這樣：

http://jsfiddle.net/NhAuJ/

問題是，當你徘徊接近圓的角落，你不能在後臺，因爲懸停該div是一個正方形並阻止它。我希望中間的圓形div是可點擊的（我將在其中放置一些東西），所以我不想阻止光標使用指針事件與其交互。

任何想法如何解決這類問題？

Answer 1

好吧，我有點理解了它。對於任何人停留在此，我能做的最好是有一個更大的圓圈，然後裏面的大圓圈的地方另一個圓作爲其子，即

<div class="big-circle"> 
    <div class="small-circle"> 

    </div> 
</div> 

然後設置指針事件沒有對大圈，將其設置爲在小圓上自動。

.big-circle { 
    pointer-events: none; 
} 
.small-circle { 
    pointer-events: auto; 
} 

它不會完全解決問題，但它會改善它。或者使用畫布作爲奴隸說。

Answer 2

據我所知，實現這一目標的唯一方法是通過html5畫布。 http://jsfiddle.net/NhAuJ/3/

http://www.html5canvastutorials.com/tutorials/html5-canvas-circles/