Webapp运动

Question

我使用iui库仅使用html css javascript创建了一个webapp，我的页面很少，所有内容都在一个html页面中，并且为了页面导航和幻灯片效果，我使用了iui框架

当有很多内容时，我可以垂直向上和向下滚动，这很好，但是我还注意到的是，如果我将页面水平从左到右或从右到左向左拖动，并且如果我从左上角对角拖动整个页面页面朝着那些方向移动，这不好

我希望锁定此运动，即使我用手指滑过或对角滑动，页面也应保持固定，并且只能垂直向上或向下移动

我需要写任何元标记来避免这种移动吗？

仅使用html css和javascript有没有一种方法可以解决此问题，或者是否有其他替代方法而无需使用xcode本地创建应用

Answer 1

如果网页的宽度大于视口的宽度，则将发生您描述的行为。 但是，如果您确保内容宽度设置为320px（并且没有子级的透明元素将内容推过该分界点），则您将无法横向滚动。

如果这不适合您，则应该能够使用touchstart / move / end事件，并使用事件对象上的preventDefault（）在javascript中禁用默认行为-http: //www.sitepen.com/blog/2008/ 07/10 / iPhone上的触摸和手势/

Answer 2

嘿Sudhakar！ 为什么不使用列表？

首先，检查您的视口元是否正确。 然后，也许媒体（图像）大于全局视口。

最后，这也可能是由于宽度：100％+一些填充/边距。 要解决此问题，请调整框大小：border-box; 可能是你的朋友

R.