Question

所以我想改变悬停效果出现的图像的位置。现在，图像类型只是在第一个保持悬停效果的图像下面。我正在努力与这个铁杆。我已经尝试定位它并将其浮动并且只是简单的左：90px或右：90px但是在悬停时显示的图像不会让步。这是一个jsfiddle。图像被破坏但你可以得到这个图片。 https://jsfiddle.net/k0fvbcno/非常感谢任何帮助。

<div id="pain1">
    <img class="pain1" src="images/painspot.png">
    <img class="shoulder" src="images/shoulder.png">
</div>  

<div id="pain2">
    <img class="pain2" src="images/painspot.png">
    <img class="back" src="images/back.png">
</div>

<div id="pain3">
    <img class="pain3" src="images/painspot.png">
    <img class="hip" src="images/hip.png">
</div>


#pain1 {
 position: absolute;
 left: 710px;
 top: 220px;
 margin: auto;
}

.shoulder {
 display: none;
}

.pain1:hover + .shoulder {
 display: inline;   
}

.pain1:hover{
 border: 3px solid transparent;
 display: block;    
}

#pain2 {
 position: absolute;
 left: 627px;
 top: 390px;
 margin: auto;
}

.back {
  display: none;
}

.pain2:hover + .back{
  display: inline;
}

.pain2:hover{
  border: 3px solid transparent;
  display: block;   
}

#pain3 {
 position: absolute;
 left: 680px;
 top: 425px;
}

.hip {
  display: none;    
}

.pain3:hover + .hip{
  display: inline;  
}

.pain3:hover {
  border: 3px solid transparent;
  display: block;   
}

Answer 1

我终于明白了。我需要使用绝对位置，这最终使我能够定位悬停效果正在使用时出现的图像。谢谢！

想要定位当不同图像悬停时出现的图像

1 个答案: