1、在小程序自带的方法onPageScroll中可以得到滑动距离顶部的距离,氏桐在data公共数据中定义scrollTop。
2、得到滑动距离后,当页面滑动超出需要固定元素距离顶部的距离后使用css样式控制其定位,因此为要在scroll-view中定义class="title{{scrollTop>30'topnav':''}}"30就是我需要定义的模块距离顶部的距离,当超配核蚂过这个距离就会执行css的topnav样培埋式。
3、否则就执行愿有的css样式。
一、自定义导航栏组件二、设置导航栏固定样式 :
此时,页面主体内容头部会有一部分被导航栏遮住在底下 ,这是因为position定位不占瀑布流空间,历塌为解决这个问题,可以给自定义导航栏加空一唤拦个高度等于导航栏的view,以此给导航栏在页面中占位,且高度等于导航栏高度
topHeight = wx.db.statusBarHeight 和烂胡+ wx.db.navBarHeight
完美解决!!!小程序仿原生自定义导航栏
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)