Question

我想更改visualViewport的比例。我想在某些条件下实际控制缩放。我怎样才能做到这一点？

Answer 1

我相信我研究和阅读的内容需要一个API。我找到了一些关于这个主题的代码，以及一个链接，你可以在哪里理解这个API是如何工作的。我想如果我理解你的问题，这将是一个解决方案：

let pendingUpdate = false;

function viewportHandler() {
  if (pendingUpdate) return;
  pendingUpdate = true;

  requestAnimationFrame(() => {
    pendingUpdate = false;
    var layoutViewport = document.getElementById('layoutViewport');

    // Since the bar is position: fixed we need to offset it by the
    // visual viewport's offset from the layout viewport origin.
    var offsetLeft = viewport.offsetLeft;
    var offsetTop = viewport.height
                - layoutViewport.getBoundingClientRect().height
                + viewport.offsetTop;

    // You could also do this by setting style.left and style.top if you
    // use width: 100% instead.
    bottomBar.style.transform = 'translate(' +
                                offsetLeft + 'px,' +
                                offsetTop + 'px) ' +
                                'scale(' + 1/viewport.scale + ')'
    }
}

window.visualViewport.addEventListener('scroll', viewportHandler);
window.visualViewport.addEventListener('resize', viewportHandler);

检查出来：https://developer.mozilla.org/en-US/docs/Web/API/Visual_Viewport_API

我想改变visualViewport的规模。我怎样才能实现这一目标？

1 个答案: