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-07-14 조회 5,451
13-07-14 조회 5,419
13-07-14 조회 4,709
13-07-14 조회 4,315
13-07-14 조회 4,174
13-07-14 조회 4,235
13-07-14 조회 4,956
13-07-14 조회 4,597
13-07-14 조회 4,382
13-07-14 조회 5,422
13-07-14 조회 5,311
13-07-14 조회 5,083
13-07-14 조회 4,805
13-07-14 조회 5,488
13-07-13 조회 3,761
13-07-01 조회 5,767
13-07-01 조회 5,850
13-07-01 조회 3,942
13-07-01 조회 5,438
13-05-27 조회 4,011
13-05-21 조회 5,049
13-05-02 조회 1만
13-04-29 조회 5,254
13-04-15 조회 5,503
13-04-13 조회 6,439
13-02-27 조회 4,121
13-02-26 조회 6,519
13-02-12 조회 5,278
13-02-01 조회 2.3만
13-01-23 조회 3,565
13-01-09 조회 8,049
13-01-07 조회 4,968
13-01-07 조회 3,721
13-01-04 조회 1.3만
13-01-03 조회 1.2만
12-12-31 조회 6,401
12-12-27 조회 4,526
12-12-27 조회 4,218
12-12-27 조회 8,886
12-12-18 조회 3,708
12-12-12 조회 3,741
12-12-12 조회 6,776
12-12-12 조회 8,194
12-12-05 조회 5,473
12-12-01 조회 6,788
12-11-22 조회 4,693
12-11-09 조회 5,541
12-11-09 조회 7,611
12-10-29 조회 4,829
12-10-16 조회 6,377
12-10-09 조회 5,441
12-09-02 조회 4,542
12-09-01 조회 3,659
12-08-30 조회 4,317
12-08-30 조회 4,313
12-08-28 조회 3,654
12-08-21 조회 7,225
12-08-20 조회 3,753
12-08-18 조회 5,170
12-08-18 조회 3,537
12-08-11 조회 3,691
12-08-09 조회 3,862
12-08-07 조회 3,847
12-08-07 조회 4,419
12-08-01 조회 4,673
12-08-01 조회 4,558
12-07-20 조회 9,927
12-07-17 조회 4,284
12-07-15 조회 4,042
12-07-10 조회 4,316
12-07-09 조회 7,028
12-07-05 조회 3,355
12-07-04 조회 3,525
12-06-30 조회 5,753
12-06-28 조회 3,856
12-06-20 조회 4,009
12-06-16 조회 3,315
12-06-14 조회 3,964
12-06-07 조회 3,993
12-06-06 조회 6,348
12-05-27 조회 4,563
12-05-25 조회 3,311
12-05-25 조회 3,134
12-05-24 조회 3,261
12-05-24 조회 4,599
12-05-23 조회 3,975
12-05-22 조회 6,591
12-05-15 조회 4,124
12-05-15 조회 3,676
12-05-14 조회 3,116
12-05-12 조회 3,567
12-05-11 조회 7,060
12-05-07 조회 4,495
12-04-28 조회 3,700
12-04-25 조회 5,349
12-04-15 조회 3,926
12-04-12 조회 4,766
12-04-11 조회 3,528
12-04-08 조회 3,381
12-03-21 조회 6,435