Convert 이미지 맵 절대 좌표로 지정된 영역 좌표

Question

나는 시도하고 싶고 절대적으로 위치하는 div로 변환하려는 영역이있는 이미지 맵을 가지고 있습니다.

나는이를 변환 할 : (절대 DIV에 싸여)이에

<area shape="rect" coords="662,346,937,426" href="#" /> 

:

<a style="left:662px; top:346px; width:275px; height:80px;" href="#" /> 

기본적으로이 변환 귀결 :

<area shape="rect" coords="A,B,C,D" href="#" /> 

을

(절대 div로 감싸 임) :

<a style="left:Apx; top:Bpx; width:C-Apx; height:D-Bpx;" href="#" /> 

스크립트를 통해이를 자동화하고 찾기/바꾸기 방법을 찾고 싶습니다. 정규식이 아무런 계산도하지 않기 때문에 효과가 없을 것이라고 생각합니다. 아마 자바 스크립트와 함께 할 수 있지만, 나는 많이 알고하지 않습니다/

Answer 1

당신이 JQuery와 함께이 문제를 해결 할 수 있습니다

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 

<script> 
$(document).ready(function() { 
    var cords = $('.area1').attr('coords').split(','); 
    $('.href1').attr('style', 'left:'+cords[0]+'px; top:'+cords[1]+'px; width:'+ (cords[2]-cords[0]) +'px; height:'+ (cords[3]-cords[1]) +'px') 
});​ 
</script> 


<area class='area1' shape="rect" coords="662,346,937,426" href="#" /> 
<a class='href1' style="left:0; top:0; width:0; height:0;" href="#" ></a>​ 

테스트 : http://jsfiddle.net/G8TLm/1/