制作html图像区域‘coord’ 闪烁或发光 …

发布于 2024-07-22 21:19:08 字数 181 浏览 4 评论 0 原文

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

p/s：粘贴问题< 区域。这就是为什么你没有看到我的完整消息。抱歉重新发布

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

冰雪之触 2024-07-29 21:19:08

我还没有测试过这个，因为我现在没有时间，但你应该能够仅使用 CSS 让它脱颖而出，如下所示：

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

i haven't tested this as i don't have time right now but you should be able to make it stand out just with CSS, something like this:

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

回复收藏 0 原文

迷荒 2024-07-29 21:19:08

两个解决方案：一是覆盖另一张图像。除了要突出显示的区域之外，覆盖图像将是透明的，并且不透明度设置得足够低，以便仍然可以看到其后面的内容。第二，使用真实图像作为前面提到的“覆盖”图像的背景图像（覆盖图像必须使覆盖区域已经是半透明的，而不是使用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;
}

Two slutions: one, overlay another image. The overlay image would be transparent except for the region you want to highlight, and with opacity set low enough to still see what is behind it. And two, use the real image as the background image to the aforementioned 'overlay' image (the overlay image must have the overlay region already be translucent instead of using css).

e.g. (version one)

<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*/
}

e.g. (version two)

<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;
}

回复收藏 0 原文

~没有更多了~