k

모바일웹 이미지맵 사용 소스

<img id="event_img" src="이미지" usemap="#mmap" style="width:100%;">
<map name="mmap">
<area id="ar1" shape="rect" href="링크1" target="_blank">
<area id="ar2" shape="rect" href="링크2" target="_blank">
<area id="ar3" shape="rect" href="링크3" target="_blank">
<area id="ar4" shape="rect" href="링크4" target="_blank">
</map>

<script language="Javascript">
<!--
function imageMap(rimg,rwidth,x1,y1,x2,y2,mapid){
 var rxsize = document.getElementById(rimg).width;
 var xp1 = rxsize / rwidth * x1;
 var yp1 = rxsize / rwidth * y1;
 var xp2 = rxsize / rwidth * x2;
 var yp2 = rxsize / rwidth * y2;
 document.getElementById(mapid).coords = xp1+","+yp1+ ","+xp2+","+yp2;
}

//원래 좌표위치
imageMap('event_img',실제 이미지 너비,747,1450,983,1700,'ar1');
imageMap('event_img',실제 이미지 너비,509,1450,745,1700,'ar2');
imageMap('event_img',실제 이미지 너비,28,1450,267,1700,'ar3');
imageMap('event_img',실제 이미지 너비,270,1450,506,1700,'ar4');
-->
</script>

원래 좌표 위치에서 이미지의 너비의 축소 정도를 파악해서
좌표를 변경해주는 스크립트입니다.

몇군제 찾아봐서 제 입맛에 맞게 띨거 다 띠고 포인트만 남긴겁니다.^^

|

댓글 3개

감사합니다. 적용해 볼게요...
감사히 쓰겠습니다^^
아이폰에서는 적용이 안됩니다...
아이폰에서는 어떻게 해야죠?
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
13-03-03 조회 6,210
13-03-01 조회 5,541
13-03-01 조회 8,277
13-03-01 조회 6,246
13-02-26 조회 3,858
13-02-26 조회 3,817
13-02-26 조회 4,706
13-02-24 조회 8,145
13-02-24 조회 4,225
13-02-24 조회 3,472
13-02-24 조회 5,271
13-02-24 조회 5,280
13-02-24 조회 4,348
13-02-24 조회 5,685
13-02-24 조회 9,371
13-02-14 조회 5,062
13-02-13 조회 8,984
13-01-29 조회 7,640
13-01-24 조회 4,992
13-01-24 조회 4,870
13-01-17 조회 4,267
13-01-16 조회 4,285
13-01-08 조회 4,370
12-12-27 조회 4,018
12-12-20 조회 1.1만
12-12-20 조회 3,348
12-12-06 조회 4,333
12-12-01 조회 4,069
12-11-28 조회 5,647
12-11-25 조회 5,354
12-10-20 조회 4,630
12-10-03 조회 4,776
12-09-26 조회 4,970
12-09-15 조회 8,411
12-09-14 조회 5,434
12-09-11 조회 3,916
12-09-10 조회 3,958
12-09-05 조회 8,827
12-08-29 조회 4,595
12-08-26 조회 3,746
12-08-23 조회 3,453
12-08-22 조회 3,521
12-08-22 조회 4,338
12-08-21 조회 3,488
12-08-20 조회 3,418
12-08-20 조회 9,223
12-08-15 조회 4,336
12-08-13 조회 3,246
12-08-11 조회 4,662
12-08-05 조회 4,519
12-08-03 조회 3,301
12-08-03 조회 3,983
12-08-02 조회 4,976
12-07-29 조회 4,079
12-07-26 조회 3,669
12-07-26 조회 3,537
12-07-22 조회 3,448
12-07-20 조회 3,275
12-07-19 조회 4,149
12-07-19 조회 3,402
12-07-16 조회 3,530
12-07-16 조회 4,444
12-07-15 조회 3,499
12-07-12 조회 7,349
12-07-12 조회 4,998
12-07-11 조회 3,028
12-07-09 조회 3,194
12-07-05 조회 3,809
12-07-04 조회 4,383
12-07-04 조회 3,791
12-07-04 조회 4,321
12-06-29 조회 3,770
12-06-27 조회 3,356
12-06-24 조회 3,828
12-06-22 조회 4,138
12-06-22 조회 8,558
12-06-22 조회 3,209
12-06-21 조회 3,226
12-06-17 조회 3,856
12-06-14 조회 3,959
12-06-14 조회 3,240
12-06-08 조회 4,396
12-06-06 조회 3,352
12-06-04 조회 4,102
12-05-26 조회 4,947
12-05-26 조회 3,895
12-05-25 조회 3,183
12-05-24 조회 3,287
12-05-22 조회 3,323
12-05-20 조회 2,960
12-05-16 조회 3,106
12-05-15 조회 3,499
12-05-10 조회 3,935
12-05-08 조회 3,448
12-05-04 조회 3,298
12-05-03 조회 4,241
12-05-02 조회 3,396
12-05-02 조회 3,148
12-05-02 조회 3,259
12-04-26 조회 3,409