单击图像上的区域时显示文本的 onclick

Question

我的网站有问题。我试图在区域上单击，当我单击图像上的区域时，我想显示图像和文本。这是我的意思的一个例子：

这是我目前创建的：


 <div class="interior" style="padding-left: 243px;">
 <img src="Pres7.png" usemap="#intr">
  <map name="intr">
   <area class="speedo" shape="circle" onclick="" coords="342,126,19" href="">
   <area class="screen" shape="circle" onclick="" coords="518,179,17" href="">
   <area class="light" shape="circle" onclick="" coords="730,229,17" href="">
   <area class="swheel" shape="circle" onclick="" coords="345,259,17" href="">
 </map>
</div>

它应该显示不同的图像和文本，所以我猜需要创建 4 个函数。

网上有好几个例子，我试过，但是给变量赋值的时候，不行。

虽然我可以通过单击来创建文本和图像，但我不知道该怎么做。

Answer 1

有一个叫做 'display' 的 CSS 属性，每个 HTML 元素都有它自己的属性默认值（其中大部分是“块”，这意味着它们覆盖了整个 X 轴），但是您可以为该显示属性提供的值之一是 'none'，这意味着它是隐藏的，您可以使用 javascript 在“none"（隐藏）和您想要的值。

示例见此处：https://www.w3schools.com/howto/howto_js_toggle_hide_show.asp

单击图像上的区域时显示文本的 onclick

Onclick that displays the text when you click area on the image

html

javascript

image

onclick

area