Javascript 如何在变换原点和滚动条之间切换

我上面有一段代码，在CSS转换原点和缩放到CSS宽度和滚动条之间切换

我需要做这个切换，因为我在我的网站上使用的一个DIV-wrap需要进行缩放

我使用CSS translateX和translateY以及Scale进行更平滑的收缩缩放，但是在缩放发生后，我需要返回到宽度和滚动条，以便用户可以在布局中移动

我在这里举了一个例子，说明我是如何进行转换的，上面有一点空白，我真的无法下定决心

正确的方法是什么

var isOrigin=false；
var originX=500；
var初始值=200；
var标度=1.5；
增值税=0；
var-deltaY=0；
变量从_origin_到_scroll=函数（）{
if（isOrigin）{from_scroll_to_origin（）；return；}
var wrap=$（'.containter.wrap'）；
//重置卷轴
const el=document.scrollingElement | | document.documentElement；
$（'.containter'）[0].scrollLeft=0；
el.scrollTop=0；
wrap.css({
transformOrigin:originX+“px”+originY+“px”，
转换：“translate3d（“+deltaX+”px，“+deltaY+”px，0）”+
“scale3d（“+scale+”，“+scale+”，1）”，
宽度：100+“%”
});
isOrigin=true；
$（'.info'）.html（'按原点和比例设置的布局'）；
}
var from_scroll_to_origin=函数（）{
var wrap=$（'.containter.wrap'）；
wrap.css({
transformOrigin:originX+“px”+originY+“px”，
转换：“translate3d（“+0+”px，+0+”px，0）”+
“scale3d（“+1+”，“+1+”，1）”，
宽度：（100*刻度）+'%'
});
$（'.containter'）[0].scrollLeft=originX*（比例-1）；
const el=document.scrollingElement | | document.documentElement；
el.scrollTop=原始*（比例-1）；
isOrigin=假；
$（'.info'）.html（'layout set by width and scroll'）；
}

正文{
保证金：0；
填充：0；
溢出-x：自动；
-webkit溢出滚动：触摸；
宽度：100vw；
}
.顶{
位置：固定；
宽度：100%；
背景色：#333；
线路高度：40磅；
文本对齐：居中；
颜色：#f1f1；
字号：20pt；
左：0；
排名：0；
z指数：10；
}
.top.info{
}
.标题内容
{
背景色：#e1e1；
线路高度：130磅；
}
.集装箱{
宽度：100%；
框大小：边框框；
溢出：自动；
-webkit溢出滚动：触摸；
}
.集装箱，包裹{
显示器：flex；
弯曲方向：立柱；
宽度：100%；
}
.集装箱.包裹{
宽度：100%；
利润上限：30分；
}

点击切换
这是标题内容-需要添加到总体计算中

在您的情况下，可能的解决方案是检测用户何时尝试缩放，何时仅滚动

const $container = $(".container");
$container.on('touchstart', function (e) {
  if (e.touches.length > 1){
    //more than one finger is detected on the screen,
    //change mode to transform-origin
    from_scroll_to_origin()
  }
});

$container.on('touchend', function (e) {
  //change mode to scrollbars
  from_origin_to_scroll()
});

---

请详细说明你的问题。我读了四遍，我都想不起来了hank you@MiXT4PE，请运行代码片段并单击标题为“单击切换”的标题。这将在两种状态之间切换。一个设置css转换，另一个设置滚动条移动和宽度调整。我想让它们相等，但即使运行代码片段，我也无法做到这一点，您的期望和问题都不清楚嘿，谢谢您的评论。但我还是不明白这是怎么回事