页面在手机浏览时上下滑动很卡不流畅的解决办法

移动互联网的兴起,让企业也跟着将目光从大大的PC屏幕聚焦到小小的手机屏幕。除了手机APP外,网站也必须考虑到手机浏览的效果。海天最近做一个网站的手机版时候,碰到了页面在手机浏览时上下滑动很卡不流畅的情况。

其实这个不流畅只是一个用户在使用的时候和别的网站对比发现的,如果没有对比还真的发现不了,因为效果并不是犹如硬件造成的卡顿那样,而是像有阻尼一样,别的页面手指一划,能感觉到明显的向上滚动,而海天的页面却好像划不动一样。

最后对比了代码,发现其实只是简单的一句css代码,只要在对应的css文件加上

-webkit-overflow-scrolling: touch;

即可。

CSS的属性-webkit-overflow-scrolling创建了带有硬件加速的系统级控件,所以效率很高,滑动很流畅。但是却会消耗更多内存。不过在流畅的滑动效果和耗费多点内存之间,那必须是选择前者的。

发表评论

电子邮件地址不会被公开。 必填项已用*标注