2023年6月20日发(作者：)

解决ios系统h5页⾯滚动条问题需求：页⾯在各种⼿机端可以正常横向滚动问题：（以下所有效果均针对ios系统下的，安卓是不存在这个问题的）1、第⼀次⽤基础css实现滚动：overflow：scroll；效果：可以滑动，但是页⾯滚动起来⾮常卡，没有回弹顺滑的效果，⼿指⼀停，页⾯就停住了。2、第⼆次⽹上搜⽅法解决了滑动很卡的现象，给很宽的那个容器加上了css属性：-webkit-overflow-scrolling：touch；overflow；scroll；效果滑动⾮常顺滑，有回弹效果，但是也出现了半透明滚动条！滑动过程中有，滑动结束⾃动消失，显得页⾯很low。3、第三次尝试在⽹上搜索到的伪元素的⽅法，为很宽的容器加上：：webkit-scrollbar{background-color:transparent;display:none}结果时⽽有滚动条时⽽没有，很懵逼，不得不继续我的尝试探索4、第四次把这个伪元素的css样式去掉了，为那个很宽的容器加上⼏个css属性：display：webkit-box；paddingbottom：10px；margin-bottom：-10px；再去尝试；完美解决

原理⽬前还没搞清楚，但是这种⽅法可以解决

2023年6月20日发(作者：)

解决ios系统h5页⾯滚动条问题需求：页⾯在各种⼿机端可以正常横向滚动问题：（以下所有效果均针对ios系统下的，安卓是不存在这个问题的）1、第⼀次⽤基础css实现滚动：overflow：scroll；效果：可以滑动，但是页⾯滚动起来⾮常卡，没有回弹顺滑的效果，⼿指⼀停，页⾯就停住了。2、第⼆次⽹上搜⽅法解决了滑动很卡的现象，给很宽的那个容器加上了css属性：-webkit-overflow-scrolling：touch；overflow；scroll；效果滑动⾮常顺滑，有回弹效果，但是也出现了半透明滚动条！滑动过程中有，滑动结束⾃动消失，显得页⾯很low。3、第三次尝试在⽹上搜索到的伪元素的⽅法，为很宽的容器加上：：webkit-scrollbar{background-color:transparent;display:none}结果时⽽有滚动条时⽽没有，很懵逼，不得不继续我的尝试探索4、第四次把这个伪元素的css样式去掉了，为那个很宽的容器加上⼏个css属性：display：webkit-box；paddingbottom：10px；margin-bottom：-10px；再去尝试；完美解决

原理⽬前还没搞清楚，但是这种⽅法可以解决