Question

我想修改基于浏览器的电子书阅读器界面，以便用户可以对内容（电子书的页面，div中的SVG）进行触摸缩放（捏缩放），但不会导致UI元素还可以缩放（底部的固定条和各种滑入元素）。

目前，UI元素位于页面底部的position:fixed div中，响应性地调整大小以使其始终是一个方便的比例。我们想要有选择地允许缩放的“页面”是占据大部分页面的全高div，包含SVG。幻灯片元素也是position:absolute

的div

因此，本质上我们希望允许用户捏缩放（使用多点触摸屏），仅在“页面”div上，但不会导致其他div进行缩放。

有关如何做到这一点的任何建议？

（我们为桌面浏览器实现了一个滑块缩放界面，工作正常，但作为移动界面不太直观）

Answer 1

由于我认为没有特定的代码可以给你，hammer.js可能是你想要研究的东西。

我想通过查看他们的get started page：

，代码会看起来像这样

 var element = document.getElementById('test_el');
 var hammertime = Hammer(element).on('pinchin', function(event) {
     alert('hello!');
 });