使 html 图像区域“坐标”闪烁或发光……答案

【问题标题】：make html image area ‘coord’ blinking or glow …使 html 图像区域“坐标”闪烁或发光……
【发布时间】：2009-06-01 02:22:18
【问题描述】：

我试图让 html 图像 <area coord tag 对查看者更清晰。任何 javascript 示例可以使这些坐标闪烁效果或类似效果，只要每个坐标对查看者来说都是清晰的？

p/s：粘贴

【问题讨论】：

标签： javascript jquery html effects

【解决方案1】：

我没有对此进行测试，因为我现在没有时间，但您应该能够仅使用 CSS 使其脱颖而出，如下所示：

area {
    filter:Glow(color=#00FF00,strength=4);
    text-decoration: blink;
}

【讨论】：

我更喜欢你的技术。但我试过它不起作用。你有我可以阅读的参考页面吗？我用的是IE
在 Firefox 中测试后，区域标签似乎没有从任何 css 中受益，所以我不确定这是否适用。
乔纳森，没关系。我的问题是，您在 Internet Explorer 中放置的 css 标签是否有效？我试过了，还是不行。

【解决方案2】：

两种解决方案：一种，叠加另一个图像。除了您要突出显示的区域外，叠加图像将是透明的，并且不透明度设置得足够低以仍然可以看到它后面的内容。第二，使用真实图像作为上述'覆盖'图像的背景图像（覆盖图像必须使覆盖区域已经是半透明的，而不是使用css）。

例如（第一版）

<span class='image_container'>
    <img id='base_image' src='base.png' >
    <img id='overlay_image' src='overlayimage.png' usemap='#yourmaphere'>
    <map name='yourmaphere'>
    ...
    </map>
</span>

.image_container {
    position:relative;
}

#overlay_image {
    position:absolute;
    top:0;
    left:0;
    opacity:0.5;
    filter: alpha(opacity = 50);
    /* text-decoration: blink; */ /*optional*/
}

例如（第二版）

<img id='base_image' src='overlayimage.png' usemap='#yourmaphere'>
<map name='yourmaphere'>
...
</map>

#base_image {
    background: transparent url(base.png) no-repeat scroll top left;
}

【讨论】：

我更喜欢直接使用 css 的技术。你的技术听起来也很有前途