如何在DIV背景链接使用USEMAP [英] How using usemap in div background url

问题描述

我错过了你
你可以帮我吗？我有这样的风格

i missed you can you help me? i have such style

.lorry{
    background: url(../img/lorry.png);background-repeat:no-repeat;
    _background: none;
    _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/lorry.png');
    height: 143px;
    width: 385px;
    float: left;
    margin: 39px 0 0 0;
}

我要添加USEMAP图像，这可能吗？

I want to add usemap on image, is it possible?

推荐答案

您不能把图像映射在后台。如果需要此功能，您将不得不层对象来实现同样的事情：

You can't put an imagemap in a background. If you need this functionality you will have to layer objects to achieve the same thing:

• 第一层：只是你的形象（未绑定到图像映射）


• 第二层：你希望出现在容器中的内容
  背景


• 第三层：图像的另一个副本绑定
  影像地图，但透明的。

下面是一个例子： http://jsfiddle.net/jamietre/fgeee/1/

下面是一般的结构，以达到这种效果。它的工作原理是具有最上面的层（所以这将是活动的）上，以透明的图像的图像映射，但结合。您所看到的实际形象就是一切的背后，是不是透明的。

Below is the general construct to achieve this effect. It works by having an imagemap on the topmost layer (so it will be active), but bound to a transparent image. The actual image you see is behind everything, and is not transparent.

您还可以通过跳过第一形象，并以此为背景，以二层DIV分配其与两层做到这一点。这如果你要在它的原始分辨率来显示图像只会工作，所以可能是好的，但这个答案是比较通用的。

You can also do this with two layers by skipping the first image, and assigning it as a background to the layer2 div. This will only work if you are going to display the image at its native resolution, so may be fine, but this answer is more general purpose.

<div id="wrapper">
    <img id="layer1" src="some/image.jpg">
    <div id="layer2" style="position: absolute; top: 0; left: 0;">
         Your content here
    </div>
    <img id="layer3" 
      style="position: absolute; top: 0; left: 0; opacity:0; *filter: Alpha(opacity=0);" 
      usemap="#your-map" src="some/image.jpg">
</div>

注：

• 是必需的包装，使绝对定位工作


• 的*过滤器：.. CSS是支持者IE＆LT; 8，不理解不透明度

这篇关于如何在DIV背景链接使用USEMAP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！