问答

在对一个DIV进行缩放时,如果获取与计算其偏移量?

作者:admin 2021-08-03 我要评论

1、问题描述 在一个大的DIV中包含着两个子DIV,由大的DIV进行缩放处理,缩放的基点在左上角,子DIV中一个是行标题,一个是内容DIV,在内容DIV下面包含着列标题与...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

1、问题描述
在一个大的DIV中包含着两个子DIV,由大的DIV进行缩放处理,缩放的基点在左上角,子DIV中一个是行标题,一个是内容DIV,在内容DIV下面包含着列标题与主要内容。
显示的所有DIV结构都是由jq动态生成与创建的,数据从后台获取,生成DOM树后,直接加入到指定DIV中。
初始缩放值,是根据生成的DOM树动态计算的。初始效果是可以进行缩小与放大。
现在需要在进行双指手势缩小与放大的同时,来计算出内容DIV与行标题DIV所需要位移的偏移量,让其位移到双指之间的指定点,视觉上保持静止,呈现放大效果,请教一下该位移应该如何去计算?(当用户进行第一次放大操作后(缩放盒子处于已经被放大阶段,而不是初始阶段),还可能进行多次放大操作,其放大所指定的点(两指之间的中心点)均可能不同)
2、已知值
scale :当前缩放值;
fisrtScale:初始缩放值;
yuan_x yuan_y:当前两指之间的中心点相对于屏幕的坐标值;
venueInnerWrapperWidth:缩放盒子的原始宽;
venueInnerWrapperHeight:缩放盒子的原始高;
3、预设例子值
venueInnerWrapperWidth:5986px;:缩放盒子原始宽度;
venueInnerWrapperHeight:33325.2px:缩放盒子的原始高度;
fisrtScale :0.0656642 :初始缩放值;
scale :0.0656642 :当前缩放值;
应用touch事件,scale变化以0.005来进行变化。
4、DOM结构图
DOM简化结构.jpg

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 在对一个DIV进行缩放时,如果获取与计

    在对一个DIV进行缩放时,如果获取与计

  • mysql的一个问题

    mysql的一个问题

  • 成为一个优秀的前端还需要掌握哪些技术

    成为一个优秀的前端还需要掌握哪些技术

  • 一个数据库表的字段只有两个值且一个值

    一个数据库表的字段只有两个值且一个值

腾讯云代理商
海外云服务器