将鼠标悬停在表格中的图像上
将鼠标悬停在表格中的图像上
提问于 2019-02-22 06:42:52
我已经制作了一个表格，它之间没有任何空间，因为我希望它作为一个地图，当你将鼠标悬停在它上面时，它会变得更大。我已经使用了W3学校的zoom div，但它在我的表格中不起作用。我想这和桌子的大小有关，但我不太清楚代码是不是这样。
#casti_male {
margin: 0px;
border: 0px;
padding: 0px;
}
/*ZOOM MAPY*/
.zoom {
transition: transform .08s;
width: 214px;
height: 115px;
}
.zoom:hover {
-ms-transform: scale(1.5); /* IE 9 */
-webkit-transform: scale(1.5); /* Safari 3-8 */
transform: scale(1.5);
}<div id="mapa">
<table id="casti_male" style="width:1495px; height: 804px;" cellspacing="0px;" cellpadding="0px;">
<tr>
<td>
<div id="zoom"><img src="castimapy-male/obrazky0.png"></div>
</td>
<td>
<div id="zoom"><img src="castimapy-male/obrazky1.png"></div>
</td>
<td>
<div id="zoom"><img src="castimapy-male/obrazky2.png"></div>
</td>
<td>
<div id="zoom"><img src="castimapy-male/obrazky3.png"></div>
</td>
</tr>
</table>
</div>
它更大，但这里是简短的版本。基本上在悬停时，它应该变得更大，而不移动其他任何东西，并且仍然像- here一样被打包在一起
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-02-22 07:06:18
在Div中使用Class而不是Id，它应该像一个护身符一样工作。检查以下代码--
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54817405
复制相关文章
相似问题