话说前几天接到了一个改bug的任务： 【问题】ios用户进入页面时底部悬浮按钮不显示，需要向下滑动，停止滑动后才会显示。
【先说一下项目的结构吧】 main.html scripts – stat.js – main.js
①由于底部按钮是通过平台配置的，故html中会生成相应的配置对象，只有会通过js遍历后插入页面节点中； ②stat.js 是一个到达页面底部才会被触发，并且只触发一次的函数（触发后解除事件绑定）； ③按钮块fixed定位在底部，且插入后，设置页面最后一个元素的margin-bottom值； ④js引入顺序为stat.js>main.js 【分析】ios下fixed的不兼容问题在页面高度变化（margin-bottom）与stat.js通过页面位置的事件绑定与解绑的过程中显现了出来。 【解决】 方法1：调换包含上述函数的js的引用顺序，使按钮渲染不受stat.js影响 ; 方法2：在底部函数之前，使用.scrollIntoView()方法，使fixed定位的按钮，出现在设备视野中 ; 方法3：为position:fixed的按钮块，添加height值 ; (解决思路：在底部函数执行之前，fixed块要先存在并放置于正确的位置)
【关于.scrollIntoView()方法，请点击这里】
转载请注明原文地址: https://ju.6miu.com/read-963100.html
