小程序 滚动wx.pageScrollTo
API:https://developers.weixin.qq.com/miniprogram/dev/api/wx.pageScrollTo.html
wx.pageScrollTo
在小程序的开发过程中,有个功能是点击后需要往view层中添加数据内容,在添加后需要将内容滚动到最下面一条,以便有更好的用户体验。
页面布局是:
最外层<view class="box">内容</view>
底部有输入框固定着<view class='footer'></footer>
为了解决抖动页面的问题:如果页面中有fixed定位的元素,定位的元素会跟随页面滚动,再回到位置上,产生页面抖动 => 在代码中加入duration:0
滚动到底部代码如下
wx.createSelectorQuery().select('.box').boundingClientRect(function (rect) {
// 使页面滚动到底部
// console.log(rect.bottom)
// console.log(rect.height)
wx.pageScrollTo({
scrollTop: rect.height,
duration: 0
})
}).exec()
参考博文 转自:https://blog.csdn.net/qq_41080490/article/details/80267742
小程序 滚动wx.pageScrollTo的更多相关文章
- 微信小程序滚动tab的实现
微信小程序滚动tab的实现 1.目的:为了解决滚动版本的tab,以及实现虹吸效果. 2.方案:自己动手写了一个Demo,用于测试实现如上的效果.其代码有做参考,在这里先声明.具体的参照如下:重庆大学二 ...
- 今天微信小程序发现wx.request不好使了,调试报错: 小程序要求的 TLS 版本必须大于等于 1.2
今天微信小程序发现wx.request不好使了,调试报错: 小程序要求的 TLS 版本必须大于等于 1.2 查官方文档 解决方法 在 PowerShell中运行以下内容, 然后重启服务器 # Enab ...
- 微信小程序遍历wx:for,wx:for-item,wx:key
微信小程序中wx:for遍历默认元素为item,但是如果我们设计多层遍历的时候我们就需要自定义item的字段名以及key的键名 wx:for="{{item.goodsList}}" ...
- 小程序调用wx.chooseLocation接口的时候无法获取权限(ios)
ios手机小程序调用wx.chooseLocation接口的时候,获取权限的时候报authorize:fail:require permission desc这样子的错误,这是由于苹果的安全机制导致需 ...
- 微信小程序-滚动消息通知
写在前面: 微信小程序学的不太多,做了一个简单的项目,回来很快时间内把在深圳两天的房租给赚回来了. 这次我主要想总结一下微信小程序实现上下滚动消息提醒,主要是利用swiper组件来实现,swiper组 ...
- 微信小程序-滚动消息通知效果
这次我主要想总结一下微信小程序实现上下滚动消息提醒,主要是利用swiper组件来实现,swiper组件在小程序中是滑块视图容器. 我们通过vertical属性(默认为false,实现默认左右滚动)设置 ...
- 微信小程序滚动动画,点击事件及评分星星制作!
前言 小程序上线刷爆了朋友圈,但是最近渐渐消沉了,很少有动静!最近公司项目需要,体验了一下微信小程序,制作了几个功能,布局感觉很简单,但是交互和动画等写起来确实很费劲,主要是因为他不能操作DOM,只能 ...
- 微信小程序-滚动Tab选项卡
前言:今天呢 给大家详细讲解一下滚动Tab选项卡:左右可滑动切换的效果,希望对大家做项目时候有用! 以前也遇到过这个,但是没有做记录.转载来源于:https://www.jianshu.com/p/9 ...
- 微信小程序滚动Tab选项卡:左右可滑动切换
最终效果如上.问题: 1.tab标题总共8个,所以一屏无法全部显示. 2.tab内容区左右滑动切换时,tab标题随即做标记(active). 3.当active的标题不在当前屏显示时,要使其能显示到当 ...
随机推荐
- Django—模型
索引 1.定义模型类 2.模型类 3.字段查询 4.查询集 5.模型类关系 6.模型类扩展 ORM简介 ORM,全拼Object-Relation Mapping,中文意为对象-关系映射,是随着面向对 ...
- 一起学爬虫——PyQuery常用用法总结
什么是PyQuery PyQuery是一个类似于jQuery的解析网页工具,使用lxml操作xml和html文档,它的语法和jQuery很像.和XPATH,Beautiful Soup比起来,PyQu ...
- ABP给WebApi添加性能分析组件Miniprofiler
在ABP的WebApi中,对其性能进行分析监测是很有必要的.而悲剧的是,MVC项目中可以使用的MiniProfiler或Glimpse等,这些都不支持WebApi项目,而且WebApi项目通常也没有界 ...
- mybaits返回自增主键ID
mybaits两种获取自增主键ID的方法:一种是使用useGeneratedKeys,第二种是selectKey方法获取. useGeneratedKeys <insert id="i ...
- 使用apt-get安装相关的软件时,不能Fetch,现在更新为国内的源!
我使用的是中国科技大学的树莓派的软件源,测试可以使用(更新时间:2018年7月15日) deb http://mirrors.ustc.edu.cn/raspbian/raspbian/ jessie ...
- Vue H5 项目模板
使用了 mint-ui sass vue fastclick vue router 一个项目的初始化状态,一个新项目,陆陆续续花了2天时间搭起来的. 里面有mint-ui的基本用法 tabbar 还有 ...
- 在Node.js中使用ffi调用dll
类似的文章还是比较多的,但或多或少有一些问题没有解决,在此我将其整合并分享给大家: 测试环境: Node.js 9.9.0 VisualStudio 2015 "ffi": &qu ...
- 图论算法之DFS与BFS
概述(总) DFS是算法中图论部分中最基本的算法之一.对于算法入门者而言,这是一个必须掌握的基本算法.它的算法思想可以运用在很多地方,利用它可以解决很多实际问题,但是深入掌握其原理是我们灵活运用它的关 ...
- 错误解决记录-------------验证启动HDFS时遇到的错误
主要解决验证启动HDFS时: 1) jps:bash: jps: command not found... 原因:主要是java/bin 环境变量没配置好. 解决办法: 在 ~/.bash_prof ...
- C# Winform控件 - Form
一.Form窗体样式 1.FormBorderStyle (1)None (2)FixedSingle (3)Fixed3D 个人感觉跟Fixedsingle区别不大 (4)FixedDialog 不 ...