PC
1、修改滚动条样式,我用的是scss 不是scss的把前面的&符换成需要滚动的元素
&::-webkit-scrollbar {/*滚动条整体样式*/
width: 20px; /*高宽分别对应横竖滚动条的尺寸*/
height: 4px;
}
&::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: #06A9AF;
}
&::-webkit-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 0;
background: rgba(0,0,0,0.1);
}
2、input输入框为number时去掉箭头
input[type="number"] {
-moz-appearance: textfield;
text-align: center;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
小程序:
1、下拉加载
onPullDownRefresh: function () {
console.log('刷新')
wx.showNavigationBarLoading();//在当前页面显示导航条加载动画。
wx.hideNavigationBarLoading();//隐藏导航条加载动画。
this.getListOrder(); //重新调用页面数据 //看情况写成自己的
wx.stopPullDownRefresh();//停止当前页面下拉刷新。
console.log("关闭");
},
2、小程序动态设置当前页面标题
//动态设置当前页面的标题。
wx.setNavigationBarTitle({
title: '我是标题'
})
3、小程序弹窗定时关闭
wx.showToast({
title: '添加成功',
icon: 'succes',
duration: 1000,
mask: true
})
附图:
4、小程序单纯提示信息
wx.showToast({
title: '删除成功',
icon: 'none'
})
附图:
5、小程序动画加载中
//调用
wx.showLoading({
title: '正在加载中...',
})
//关闭
wx.hideLoading();
附图:
6、小程序返回上一页,上几页。。。
var pages = getCurrentPages();//页面指针数组
var prepage = pages[pages.length - 2];//上一页面指针
prepage.setData({
});//操作上一页面
wx.navigateBack({
delta: 1,
});//返回上一页面
7、小程序扫一扫
wx.scanCode({
success: res => {
console.log(res.result)
wx.navigateTo({
url: '../index/index'
})
}
})
8、nav吸顶效果,可以用粘贴定位(兼容性不太好)
position:sticky粘性定位