創建HTML元素

Question

我需要創建這個形狀自定形狀：

的界限並不在此畫面清晰，但在現實，這是常規的曲線。內圈是我的內在元素。 我有實現這個元素的一些挑戰：

• 我useed <div>，我不能與邊界半徑和任何其他方法上邊框。
• 用於<div>並設置爲background-image，但我有界限的問題，我想正是改變鼠標光標在元素界。
• 我使用<img>並設置<map>和<area>爲它設置我的界限，但我有我的內部元素的問題。
• 最後我用HTML5和畫布元素但對於內部元素，圓，我無法找到任何常規solution.it的非常重要的界限的元素

我怎樣才能實現這個目標？

Answer 1

你幾乎可以使用HTML5畫布。從我讀到的問題來看，你不能確定改變光標的圓的範圍。實際上，檢測光標是否位於圓圈內部非常容易。你一定會有圓心的x，y位置以及右半徑？因此，所有你需要做的是檢查光標的x/y座標和圓的中心之間的距離小於（或等於）半徑與否。如果是的話，那麼它是在圈內，否則它在外面:)