图像映射在资源管理器中无效

时间:2013-10-24 21:10:25

标签: html css internet-explorer

出于某种原因,我的图像映射在除Internet Explorer之外的每个浏览器中都有效,

我似乎无法弄清楚原因,也无法准确测试,因为我在Mac上。

<div id="joinnow">        
        <div style="text-align:center; width:358px; margin-left:auto; margin-right:auto;">
            <map id="imgmap20131021153742" name="imgmap20131021153742"><area shape="rect" alt=""      title="" coords="23,26,162,109"  href="https://signup.myiclubonline.com/iclub/signup/home.htm#plans?clubNumber=3790"  target="_blank" /><area shape="rect" alt="" title="" coords="22,114,158,188"  href="https://signup.myiclubonline.com/iclub/signup/home.htm#plans?clubNumber=4790"  target="_blank" /><area shape="rect" alt="" title="" coords="201,103,340,185"  href="http://therac.wufoo.com/forms/z7x4a3/" onclick="window.open(this.href,  null,  'height=825, width=475, toolbar=0, location=0, status=1, scrollbars=1, resizable=1'); return  false" title="TheRAC" /></map>
            <img src="http://www.therac.net/images/joinnow.jpg" USEMAP="#imgmap20131021153742" />
        </div>
</div>

ID为“joinnow”的div的CSS是......

#joinnow
{
    font-size:18px;
    font-weight:500;
    font-family:Tahoma, Geneva, sans-serif;
    color:#fff;
    text-align:center;
    position:relative;
    float:right;
    background-image:url(images/joinnow.jpg);
    height: 195px;
    width:179px;
}

提前感谢您提供的任何帮助!

1 个答案:

答案 0 :(得分:1)

在这里工作得很好,Internet Explorer 11

usemap是小写

<div id="joinnow">        
        <div style="text-align:center; width:358px; margin-left:auto; margin-right:auto;">
            <map id="imgmap20131021153742" name="imgmap20131021153742"><area shape="rect" alt=""      title="" coords="23,26,162,109"  href="https://signup.myiclubonline.com/iclub/signup/home.htm#plans?clubNumber=3790"  target="_blank" /><area shape="rect" alt="" title="" coords="22,114,158,188"  href="https://signup.myiclubonline.com/iclub/signup/home.htm#plans?clubNumber=4790"  target="_blank" /><area shape="rect" alt="" title="" coords="201,103,340,185"  href="http://therac.wufoo.com/forms/z7x4a3/" onclick="window.open(this.href,  null,  'height=825, width=475, toolbar=0, location=0, status=1, scrollbars=1, resizable=1'); return  false" title="TheRAC" /></map>
            <img src="http://www.therac.net/images/joinnow.jpg" usemap="#imgmap20131021153742" />
        </div>
</div>

#joinnow
{
    font-size:18px;
    font-weight:500;
    font-family:Tahoma, Geneva, sans-serif;
    color:#fff;
    text-align:center;
    position:relative;
    float:right;
    background-image:url('images/joinnow.jpg');
    height: 195px;
    width:179px;
}

http://jsfiddle.net/6LN6C/2/