uniapp的返回顶部按钮

电视遥控器通常包含一个菜单键、音量控制按钮、频道选择按钮、静音按钮、搜索按钮等。 #生活常识# #电视#

效果图：

1、HTML部分

<!-- 返回顶部按钮 --> <view class="back-btn" @click="toTop" :style="{'display':(flag===false? 'none':'block')}"> <image src="../../static/toTop1.png" class="back-btn_img"></image> </view>

2、JS部分

// 返回顶部 toTop() { uni.pageScrollTo({ scrollTop: 0, duration: 100, }); }, onPageScroll(e) { //根据距离顶部距离是否显示回到顶部按钮 if (e.scrollTop > 1000) { //当距离顶部大于1000时显示回到顶部按钮 this.flag = true } else { this.flag = false } }

3、CSS部分

/* 返回顶部 */ .back-btn { position: fixed; right: 40rpx; z-index: 9999; bottom: 150rpx; color: #353535; .back-btn_img { // width: 70rpx; // height: 160rpx; width: 70rpx; height: 70rpx; } }

一个小小后端的爬行痕迹

0

0

posted @ 2021-03-29 09:20  潜跃  阅读(982)  评论()    收藏  举报

网址：uniapp的返回顶部按钮 https://c.klqsh.com/news/view/273615

相关内容

uniapp的返回顶部按钮
uniapp实现返回顶部
uniapp 回到顶部组件
Win11怎么添加显示桌面按钮？Win11显示桌面按钮设置教程
HMD 130/150 MUSIC 功能手机曝光: 后置大喇叭、专用媒体控制按钮
uniapp三端社区社交圈子小程序的搭建与功能/打造专属您的社交圈，圈子社交app前端+后端源码/社交兴趣圈子
Windows 11 文件资源管理器新增了许多实用的按钮
系统界面实现及介绍
感激之力：如何开始写感恩日记？启动快乐按钮！
李丽珍与徐锦江：破尺度之作《不扣钮的女孩》带来的情感震撼

随便看看