iPad 上无法滚动网页
在 iPad 上我无法滚动网页。它在 OS X 上的 Safari、Chrome 和 Firefox 中运行良好。
该页面有一个区域,其中的内容只能水平滚动。它由一个宽度 = 100% 和高度 = (100% - 40px) 的容器 div 组成。我通过 JavaScipt 函数设置高度,该函数由窗口调整大小事件触发。该容器内部是另一个具有内容宽度的 div(非常宽,以避免换行)。里面就是内容。
容器的 CSS 属性为:
overflow-x:scroll;
overflow-y:hidden;
white-space:nowrap;
请参阅此处的页面和完整源代码: dcfoto.de
在 iPad 上,滚动是不可能。我做错了什么? 顺便说一句:调整大小也无法在方向改变时正常工作。也许这是有联系的。
On iPad I cannot scroll a web page. It works fine in Safari, Chrome and Firefox on OS X.
The page has an area in which content can be scrolled only horizontally. It consists of a container div which has width = 100% and height = (100% - 40px). I am setting the height by a JavaScipt function which is triggered by window resize events. Inside this container is another div with the width of the content (very wide, to avoid line breaks). Inside that is the content.
CSS properties of the container are:
overflow-x:scroll;
overflow-y:hidden;
white-space:nowrap;
See the page and full source code here: dcfoto.de
On iPad, scrolling is not possible. What am I doing wrong?
By the way: resizing also does not work properly on orientation change. Maybe that's connected.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
不幸的是,需要执行两指滑动,即使这样它也没有响应(与默认的单指滑动滚动相比)。
有很多 javascript 解决方案(sencha touch 和 iscroll 是最有前途和最先进的)
我会推荐 http:// /cubiq.org/iscroll-4 这无疑是最酷的触摸滚动脚本。它也适用于 android,但速度相当慢,因为默认的 android 浏览器(尽管基于 webkit)不支持与 mobile safari 一样好的 css3 3d 加速属性。
如果我是你,我会检查用户的用户代理,并为 android 和 ipad/iphone 用户部署该脚本。
Unfortunately a two-finger swipe needs to be performed, and even then it is not responsive (when compared to the default one finger swipe scroll).
There are quite many javascript solutions out there, (sencha touch and iscroll being the most promising and advanced)
I would recommend http://cubiq.org/iscroll-4 which is hands down the coolest touch-scroll script out there. It also works for android, but quite more sluggishly since the default android browser albeit webkit based doesnot support css3 3d accelerated properties as good as the mobile safari one.
If I were you I would check for the user agent of the user, and deploy that script for android and ipad/iphone users.