1

我正在尝试解决以下问题：

情况：

我有一个包含图像的外部 div。此外，它包括多个内部 div。

问题：

我想在不缩放/调整外部 div 的情况下缩放 div 内的图像。此外，外部 div 应提供滚动条（带有溢出：滚动或溢出：自动 css 选项）。内部 div（正方形或圆形等元素）应保持其位置。我的意思是：想象图像是由 16 个字段组成的图片。我在字段编号中放了一个正方形。2/2（第 2 行，第 2 列）。当我缩放时，我不想让它失去它的位置，因为图像正在调整大小并且正方形保持它的位置。

这是我的结构：

#divOuter { 位置：相对；边框：3px 纯红色；高度：400px；宽度：1000px；溢出：自动；字体大小：12px；变换原点：左上角；-o-transform-origin：左上角；-moz-transform-origin：左上角；-webkit-transform-origin：左上角；-ms-transform-origin：左上角；z-索引：1}

<div id="divOuter" >
    <img id="image" width="800" height="400" src="../../Imagefiel.jpg" alt="">
    </img>
    <div id="circleID" title="circle11" style="border: 1px solid black; border-radius:   
    10px; width: 20px; height: 20px; position:absolute;left: 579px; top: 262px; background-
    color: green; z-index:3">
    </div>
</div>

我已经尝试了两件事： - 通过变换/缩放缩放它几乎可以按预期工作，但外部 div 也在调整大小，它不应该。我使用了这些命令： $("#divTest").css('transform', 'scale(' + parseFloat(nScale / 100) + ')'); $("#divTest").css('font-size', nScale);

  • 增加图片大小（宽度/高度）

如果有人可以帮助我解决这个问题，我将不胜感激。

谢谢，桑切斯

编辑：我可以解决它:) 我在外部 div 中包含了一个进一步的 div（位置：相对）并对其进行了缩放。这样，内部元素相对于外部相对 div 定位。

4

0 回答 0