前言 很多小程序、app都有这种设计： 效果1.将导航栏固定在页面顶部。 效果2.点击导航栏，页面自动滚动到对应内容位置。 效果3.滚动页面自动切换至对应导航栏 效果演示： 代码 wxml 属性解释： scroll-x="true"： 允许横向滚动 ...

实现的效果： js: Page({ data: { // tab切换 currentTab: 0, }, swichNav: function (e) { console.log(e ...

简介 看到今日头条小程序页面可以滑动切换，而且tab导航条也会跟着滚动，点击tab导航，页面滑动，切导航栏也会跟着滚动，就想着要怎么实现这个功能 像商城类商品类目如果做成左右滑动切换类目用户体验应该会好很多，我这里只是一个小demo，没有怎么去考虑数据的问题，主要是想着去实现这么个功能 ...

1.展示 2.代码片段 ...

本篇文章给大家带来的内容是关于微信小程序实例：实现顶部tab切换以及滑动切换时导航栏会随着移动的效果（代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。 实现的效果： js: 1 2 3 4 5 6 7 8 9 10 11 12 ...

底部导航栏这个功能是非常常见的一个功能，基本上一个完成的app，都会存在一个导航栏，那么微信小程序的导航栏该怎么实现呢？经过无数的踩坑，终于实现了，好了，先看看效果图。 对于底部导航栏，小程序上给出的文档要求里面的item最少2个，最多五个。 好了，先看看代码： 在项目中找到这个文件 ...

加入购物车的时候，往往会有产品相关属性的选择，比如：尺寸，规格等。像我做的项目中，就有一个门店的选择，如下图： 我们如何做到当前点击的这个高亮呢？今天就讲一下如何实现这个功能。 思 ...

实现效果： 点击3个对号中任意一个图标切换成小红旗图标并放大1.2倍。 主要知识点： 1.鼠标经过出现小手状态。cursor:pointer 2.取消li标签的默认样式. list-style：none; 3. ...