博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iphone 在设置了initial-scale=1 之后,在设置滚动条之后,没有滑动效果的解决办法...
阅读量:4632 次
发布时间:2019-06-09

本文共 555 字,大约阅读时间需要 1 分钟。

iphone在设置了initial-scale=1 之后,我们终于可以以1:1 的比例进行页面设计了。

关于viewport,还有一个很重要的概念是:iphone 的safari 浏览器完全没有滚动条,而且不是简单的“隐藏滚动条”,是根本没有这个功能。

iphone 的safari 浏览器实际上从一开始就完整显示了这个网页,然后用viewport 查看其中的一部分。

当你用手指拖动时,其实拖的不是页面,而是viewport。浏览器行为的改变不止是滚动条,交互事件也跟普通桌面不一样。

解决办法:

用iphone或ipad浏览很长的网页滚动时的滑动效果很不错吧?不过如果是一个div,然后设置height:200px;overflow:auto;的话,可以滚动但是完全没有那滑动效果,很郁闷吧?

我看到很多网站为了实现这一效果,用了第三方类库,最常用的是iscroll(包括新浪手机页,百度等)我一开始也使用,不过自从用了-webkit-overflow-scrolling: touch;样式后,就完全可以抛弃第三方类库了,

把它加在body{}区域,所有的overflow需要滚动的都可以生效了。

转载于:https://www.cnblogs.com/xiaofenguo/p/6068357.html

你可能感兴趣的文章
图论算法——SPFA算法
查看>>
linux实现自动检测进程是否存活的脚本
查看>>
HttpWatch的时间分析
查看>>
CSS3 Transform
查看>>
loadrunner生成随机数
查看>>
LoadRunner测试场景中添加负载生成器
查看>>
20145315 《信息安全系统设计基础》第9周学习总结
查看>>
windows系统下安装memcache
查看>>
20170502 匹配单个字符串
查看>>
day7
查看>>
实战 iTextSharp
查看>>
C语言学习及应用笔记之七:C语言中的回调函数及使用方式
查看>>
四则运算2 设计思路
查看>>
c#之线程池优先级
查看>>
Java遍历Set集合方法
查看>>
Django 里的HttpResponse 与 JsonResponse
查看>>
QQ,微信,新浪原生分享
查看>>
英语语法最终珍藏版笔记- 23连接词
查看>>
要在实践中去学习
查看>>
nodejs(1) fs 和 path
查看>>