Javascript 应用CSS缩放后，部分块消失

我想通过点击来放大div，但放大后这个块的一部分是隐藏的

演示：

CSS属性

变换原点：0

不适合，因为将来我需要跟踪我单击的位置并将其增加到这个位置

谢谢

---

UPD:

好的，伙计们。 我可能无法准确地解释这个问题

在这里，我添加了click事件处理程序，它接收click的坐标，并缩放到click位置

---

如果我单击到数字为9的单元格（例如），我无法将网格滚动到数字为1的单元格。

您可以直接设置内容大小而不是缩放，并使用

背景大小来缩放图像，例如：

#内容{
宽度：300px；
高度：300px；
背景：url(http://placeimg.com/300/300/any);
背景大小：100%；
}
#内容量表{
宽度：450px；
高度：450px；
/*-webkit转换：比例（1.5）*/
-webkit过渡：所有.5s轻松输入输出；
}

编辑：
以上已经解决了无法滚动到部分图像的问题。您可以使用JQuery动画处理坐标问题（您无法从CSS控制滚动位置），但它不会平滑，因为它不会与CSS动画同步。您的单击处理程序类似于：

var x=event.clientX，
y=event.clientY，
$this=$（this），
缩放=$这个.hasClass（'scaled'）；
$this.toggleClass（'scaled'）；
如果（缩放）{
$this.parent（）.animate({
左：x，
滚动顶部：y
}, 500);
}

以下是应用于第二个bin的结果：

问题是，如果父对象和子对象的大小相同，那么它将显示一个滚动条，正如您在这把小提琴中看到的那样


正如您在上面的小提琴中看到的，我添加了
滚动
，并且
宽度
和
高度
与
px中的父级相同，因此
滚动
即将出现

解决办法是你可以给
100%
宽度
和
高度
，就像我在下面的例子中所示的那样

如果您不希望滚动条出现，可以从父项中删除
溢出：auto


您还可以使用
transform origin property
从要缩放图像的位置缩放图像，就像我在下面的示例中使用的
center-center
那样，使图像从中心缩放

您应该尝试使用缩放属性：

#content.scaled{
缩放：1.2；
}
几种解决方案：

移除包装器的自动溢出。

缩放包装而不是内容。

'此块的一部分在缩放后隐藏'？你这是什么意思？你有一个固定的宽度和高度的容器，所以你可以在那里滚动。缩放后，图像左侧和顶部的部分不可用。可以在图像上显示单击后图像的行为。我没有完全理解你。如果在单击前后都使用固定的宽度和高度，同时保持overflow:auto，它将添加一个滚动条和您现在看到的相同行为。请记住，图片左上角所描绘的内容。然后按它。现在你看不到上面有什么了。那么你希望它如何缩放？从中心缩放？