Extra Form
CMS 기타

간단하게 html 형태로 코딩하고 링크를 걸었는데,

황당하게도 위에 소스는 클릭이 되고

똑같은 소스임에도 불구하고 아래 소스는 클릭이 안됩니다.

 

익스플로러, 크롬 모두 해보고

임시파일, 캐쉬 모두 지우고도 해봤는데

2번째 소스는 클릭이 안되네요

 

============= Source 1 ================================

<html>
    <head>
        <title>AirLink</title>
    </head>
    <body>
        <table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
            <tbody>
                <tr align="center">
                    <td style="padding-bottom: 10px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_AirLink_17B20-1.png" border="0" alt="" /></td>
                </tr>
                                <tr align="center">
                    <td style="padding-bottom: 10px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_AirLink_17B20-2.png" border="0" alt="" /></td>
                </tr>
            </tbody>
        </table>
        <map name="ew_webzine">
            <area shape="rect" coords="176,712,376,768" href="http://www.witree.co.kr/layouts/witree_2015/data/product/Data%20Sheet/AirLink_SpecSheet_Kor.pdf" target="_blank" />
            <area shape="rect" coords="419,712,593,762" href="http://witree.co.kr/borad_two" target="_blank" />
            <area shape="rect" coords="441,880,578,930" href="http://witree.co.kr/" target="_blank" />
            <area shape="rect" coords="603,933,767,951" href="http://witree.co.kr/" target="_blank" />
            <area shape="rect" coords="603,952,774,969" href="mailto:[email protected]" target="_blank" />
            <area shape="rect" coords="603,970,778,988" href="mailto:[email protected]" target="_blank" />
        </map>
    </body>
</html>

 

 

============= Source 2 ================================

<html>
    <head>
        <title>ACKSYS New Products</title>
    </head>
    <body>
        <table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
            <tbody>
                <tr align="center">
                    <td style="padding-bottom: 0px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_NewProducts/DM_NewProducts_01.png" border="0" alt="" /></td>
                </tr>
                                <tr align="center">
                    <td style="padding-bottom: 0px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_NewProducts/DM_NewProducts_02.png" border="0" alt="" /></td>
                </tr>
                                <tr align="center">
                    <td style="padding-bottom: 0px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_NewProducts/DM_NewProducts_03.png" border="0" alt="" /></td>
                </tr>
                                <tr align="center">
                    <td style="padding-bottom: 0px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_NewProducts/DM_NewProducts_04.png" border="0" alt="" /></td>
                </tr>
                                <tr align="center">
                    <td style="padding-bottom: 0px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_NewProducts/DM_NewProducts_05.png" border="0" alt="" /></td>
                </tr>
                                <tr align="center">
                    <td style="padding-bottom: 0px;"><img usemap="#ew_webzine" src="http://www.witree.co.kr/2015_renewal/images/DM_NewProducts/DM_NewProducts_06.png" border="0" alt="" /></td>
                </tr>                                
            </tbody>
        </table>
        <map name="ew_webzine">
            <area shape="rect" coords="306,3240,347,3278" href="http://www.witree.co.kr/layouts/witree_2015/data/product/Data%20Sheet/RuggedAir100_SpecSheet_Kor.pdf" target="_blank" />
            <area shape="rect" coords="377,3240,421,3278" href="http://www.witree.co.kr/ethernet_prd_desc/7335" target="_blank" />
            <area shape="rect" coords="306,3484,347,3522" href="http://www.witree.co.kr/layouts/witree_2015/data/product/Data%20Sheet/RuggedAir1000_SpecSheet_Kor.pdf" target="_blank" />
            <area shape="rect" coords="377,3484,421,3522" href="http://www.witree.co.kr/ethernet_prd_desc/7389" target="_blank" />
            <area shape="rect" coords="306,3727,347,3764" href="http://www.witree.co.kr/layouts/witree_2015/data/product/Data%20Sheet/AirXroad_SpecSheet_Kor.pdf" target="_blank" />
            <area shape="rect" coords="377,3727,421,3764" href="http://www.witree.co.kr/ethernet_prd_desc/7702" target="_blank" />
            <area shape="rect" coords="306,3970,347,4006" href="http://www.witree.co.kr/layouts/witree_2015/data/product/Data%20Sheet/AirLink_SpecSheet_Kor.pdf" target="_blank" />
            <area shape="rect" coords="377,3970,421,4008" href="http://www.witree.co.kr/ethernet_prd_desc/6730" target="_blank" />
            <area shape="rect" coords="306,4217,347,4254" href="http://www.witree.co.kr/layouts/witree_2015/data/product/Data%20Sheet/AirBox_SpecSheet_Kor.pdf" target="_blank" />
            <area shape="rect" coords="377,4217,421,4254" href="http://www.witree.co.kr/ethernet_prd_desc/7513" target="_blank" />
            <area shape="rect" coords="32,7446,89,7498" href="https://www.youtube.com/channel/UC1rpw3no2eqGRh_uLvacyTA/featured" target="_blank" />
            <area shape="rect" coords="122,7446,179,7498" href="https://blog.naver.com/industry40" target="_blank" />
            <area shape="rect" coords="650,7435,784,7445" href="http://witree.co.kr/" target="_blank" />
            <area shape="rect" coords="704,7481,835,7493" href="mailto:[email protected]" target="_blank" />
        </map>
    </body>
</html>

  • profile
    usemap와 map의 name은 보통 1:1로 매칭하지 않나요?
  • profile profile
    소스1은 클릭이 잘 잡히더라구요...
  • profile
    소스 1은 링크를 걸 이미지가 두 번째 이미지인 것으로 보이는데, 이 이미지 사이즈가 800*1000입니다.
    좌표값들도 이를 넘지 않구요.

    그런데 소스2의 좌표값들을 보시면 이미지는 표로 넣으시느라 각각 높이 1252픽셀로 쪼개 놓았는데 좌표값은 Y값이 최소 3000이 넘고 있습니다. 아마 좌표값을 먼저 잡으신 다음 이미지를 쪼개서 각 표의 셀에 넣으셨다보니 이미지를 쪼개기 전 Y좌표를 넣으신 게 아닌가 싶은데요, 당연히 링크 영역이 이미지를 넘어서 존재하니 클릭이 불가능한 거죠.

    일단 Double U님께서 말씀하신대로 usemap은 가급적 1:1매칭시켜주시구요...
    링크를 걸 이미지들을 쪼개셨으면 그에 맞게 각각의 이미지의 사이즈를 기준으로 해서 좌표값들을 잡아주시면 됩니다.
  • profile profile
    네...정말 감사합니다...^^