css解决手机端左右滑动不流畅的问题

最近有个需求是图片列表,左右滑动,于是用的css的 overflow-x:scroll 实现的,元素得要float,具体就不说了,说问题,问题就是在移动端滑动得时候一点都不流畅,想要像用了swiper那样得滑动流畅,当时就找各种方法,其实用swiper就全解决了,但是也不能为了它,多引入200多kb的文件啊,最终找到了一种完美的解决方法,一行css代码搞定,如下:

.content ul li.list4 .picture {
    width: 100%;
    height: 3.64rem;
    padding: .2rem 0 .32rem;
    margin: 0;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
}

就是在最外层父元素 : overflow-x:scroll , 加上一行 -webkit-overflow-scrolling: touch; 哇塞,手机上真的可以了欸,开森~
附上:谷歌浏览器是自动会流畅
大佬说,能用css解决的千万不要用js解决 ,skr ~

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,845评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,879评论 1 45
  • 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握CSS三种显示...
    七彩小鹿阅读 6,361评论 2 66
  • 外婆住在长阳清水溪边, 清水溪的米酒外婆酿造, 清水溪的米酒苏区响当当, 入了苏区干部的文章, 甜到了人们的心坎儿...
    断臂的维纳斯阅读 299评论 0 0
  • 四月中旬,因为准备二十年同学会事宜,与市区筹备组的同学们见了一面。在确定了同学会相关活动节目事项后,大家也闲聊了一...
    若水拂心阅读 415评论 0 0