Question

即使我使用jquery更改img大小，如何保持图像中包含关闭按钮

#full_image {
width: 200px;
height: 200px;
left: 0px;
top:10px;
position: relative;
opacity: 1;
z-index: 9;
}

#full_image img {
left: 20px;
width: 339px;
height: 211px;
position: relative;
overflow: hidden;
}

#full_image .close{
 background: url("http://www.sobral.ce.gov.br/saudedafamilia/close.jpg") no-repeat;
 top: 5px; 
 right: 0px;  
cursor: pointer;
height: 29px;
opacity: 1;
position: absolute;    
width: 29px;
z-index: 999;
}


<div id="full_image"><img src="http://coe.berkeley.edu/forefront/fall2005/images/woz1.jpg" />
<span> <a href="#" class="close"></a></span>
 </div>

JSFIDDLE

Answer 1

使用以下CSS：

#full_image {
    position: relative;
}

#full_image span {
    position: absolute;
    top: 0;
    right: 0;
}

这表示跨度相对于#full_image定位，并且位于其右上角。

希望这会有所帮助：）

Answer 2

您没有指定“图像中包含的关闭按钮”的含义。我本来试图把我的图像和按钮放在这样：

HTML：

<div>
    <img id="myImage"></img>
    <button id="myButton" />
</div>

CSS：

#myImage {
    position: relative;
}

#myButton {
    position: absolute;
    top: ???;
    left: ???;
}

jQuery的：您必须计算按钮的放置位置（您应该为f ex top:和left:提供CSS属性）

保持图像包含在另一个图像中。

2 个答案: