테두리 반경 및 : 마우스 오버 상태 영역 문제

Question

이 질문에 대한 답을 찾기 위해 어디에서나 찾고 있습니다. 그러나 그것에 대해 아무 것도 찾을 수 없습니다. 누구나 항목 호버 border-radius 속성을받은 영역에 영향을 미칠 수 있는지 여부를 알려줄 수 있습니까? 따라서 실제 영역을 본 후 색상과 같은 변화의 효과가 발생 했습니까? DOM에 실제로 존재하는 사각형을 사각형으로 차단하지 마십시오.

이것은 단순한 img입니다.

및 간단한 바이올린 :

https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events?redirectlocale=en-US&redirectslug=CSS%2Fpointer-events

하거나 SVG를 사용 www.jsfiddle.net/nawAE

Answer 1

글쎄, 당신은 포인터 이벤트 SVG 등을 사용할 수 있습니다 어쩌면 Raphäel과 같은 프레임 워크가있을 수 있습니다.

아니면 내가 그 시도하자,지도와 연주 ...

http://jsfiddle.net/coma/nawAE/10/

HTML

<img class="div" src="http://images2.wikia.nocookie.net/__cb20100822143346/runescape/images/2/21/1x1-pixel.png" usemap="hack"/> 

<map name="hack"> 
    <area shape="circle" coords="200,200,200" /> 
</map> 

JS

$('area').hover(function(event) { 

    $('img.div').toggleClass('hover'); 

}); 

모습 MOM, NO JS : 그

http://jsfiddle.net/coma/nawAE/12/

.div { 
    display: block; 
    font-size: 0; 
    width: 400px; 
    height: 400px; 
    background-color: red; 
    border-radius: 50%; 
} 

map:hover + img { 
    background-color: blue; 
} 

더 :

http://jsfiddle.net/coma/nawAE/16/