这个方法可以用来在上滑滚动的时候,让某一个区域置顶,

在下滑的时候,又变为原来的位置哈!

<huadong :class="{'hident':isFixed}"  id="box"></huadong>
onLoad() {
const query = wx.createSelectorQuery();
query.select('#box').boundingClientRect();
query.exec((res) => {
console.log(res); //这个节点距离顶部的距离 和距离底部的距离
this.menutop = res[0].top;
})
}

微信小程序之某个节点距离顶部和底部的距离 createSelectorQuery的更多相关文章

  1. 微信小程序从零开始开发步骤(三)底部导航栏

    上一章节,我们分享了如何创建一个新的页面和设置页面的标题,这一章我们来聊聊底部导航栏是如何实现的.即点击底部的导航,会实现不同对应页面之间的切换. 我们先来看个我们要实现的底部导航栏的效果图:(三个导 ...

  2. 微信小程序中两种回到顶部按钮的效果实现

    一,使用view形式的回到顶部HTML: <image src='../../img/button-top.png' class='goTop' hidden='{{!floorstatus}} ...

  3. 微信小程序 实现点击返回顶部

    效果: wxml: <!-- 点击回顶部 --> <image src='/images/top.jpg' class='goTop' hidden='{{showTop}}' bi ...

  4. 微信小程序监听view到顶部的高度

    view style='width:100%;height:80rpx;' id='navigation'></view> wx.createSelectorQuery().sele ...

  5. 【重点突破】—— UniApp 微信小程序开发官网学习One

    一.初步认识 uni-app官网:https://uniapp.dcloud.io/component/README HBuilderX官方IDE下载地址: http://www.dcloud.io/ ...

  6. 微信小程序之换肤的功能

    pc或者移动端实现换肤功能还是比较简单的,大致就是需要换肤的css,还有正常的css:把当前皮肤类型存入本地:然后通过js读取并判断当前应该加载哪套css. 由于微信小程序没有操作wxss的api,所 ...

  7. WordPress版微信小程序2.1.5版发布

    WordPress版微信小程序功能已经基本完善,利用这套程序,搭配WordPress提供的rest api,WordPress网站的站长可以快速搭建属于自己的网站微信小程序 . WordPress版微 ...

  8. 微信小程序从零开始开发步骤(一)搭建开发环境

    从零到有写一个小程序系列专题,很早以前就想写来分享,但由于项目一直在进展,没有过多的时间研究技术,现在可以继续分享了. 1:注册 用没有注册过微信公众平台的邮箱注册一个微信公众号, 申请帐号 ,网址: ...

  9. 微信小程序-页面下拉

    微信小程序当滑动到最顶部和最底部时,继续下拉,会将整个页面拉下去或者拉上去,本来以为是客户端自有的特性,就没去管他,直到我的禅道出现了这个记录... 其实这个问题是可以解决的,只需要在你不想出现在此情 ...

  10. 微信小程序切换标签改变样式

    微信小程序切换标签改变样式 wxml <!--顶部导航栏--> <view class="swiper-tab"> <view class=" ...

随机推荐

  1. typescript参照C#/java/swift学习小结

    学typescript,首先肯定是看官方文档,http://www.typescriptlang.org,国内翻译网站:https://www.tslang.cn 说实话,这个文档看下去,是昏昏欲睡的 ...

  2. Google 发布:DevOps 2022现状报告

    在过去的八年中,全球超过 33,000 名专业人士参与了Accelerate State of DevOps 调查,使其成为同类研究中规模最大.运行时间最长的一项.Accelerate State o ...

  3. SQL SERVER数据分组后取第一条数据——PARTITION BY

    MySQL 数据分组后取第一条数据 SQL SERVER (mssql) 数据分组后取第一条数据 SQL 如下 找状态=1的数据,按 HospitalId,DeptId 组合并倒序排序,每组里面取第一 ...

  4. Intellij IDEA 关闭阿里编码规约“请不要使用行尾注释”提醒

    Settings -> Inspections -> 注释 取消 "方法内部单行注释 xxxx " 里面的勾,[设完后重启]如下图

  5. ECS 挂载 OSS 多Bucket

    ECS 挂载 OSS,等同于在ECS 上使用内网的 Bucket 域名,不需要收取流量费用,减少接口代码的编写. CentOS系统 安装 wget http://gosspublic.alicdn.c ...

  6. Python 基于深度学习的 opencv 车牌识别系统,可以准确识别车牌号

    大家好,我是程序员徐师兄,6 年大厂程序员经验,点击关注我 简介 毕业设计基于Opencv的车牌识别系统 车牌搜索识别找出某个车牌号 对比识别车牌系统 车牌数据库认证系统 车牌图文搜索系统 车牌数据库 ...

  7. VA21 创建报价单

    1.前台 报价是提供给客户交付货物或服务的一份文件,客户想要知道产品价格以及装运时间. 事务代码VA21 输入报价单类型和销售组织.分销渠道.产品组 输入售达方和行项目的物料信息,订购数量等信息 输入 ...

  8. C# .NET Socket SocketHelper 高性能 5000客户端 异步接收数据

    网上有很多Socket框架,但是我想,C#既然有Socket类,难道不是给人用的吗? 写了一个SocketServerHelper和SocketClientHelper,分别只有5.6百行代码,比不上 ...

  9. L3-002 特殊堆栈 (双数组模拟栈)

    堆栈是一种经典的后进先出的线性结构,相关的操作主要有"入栈"(在堆栈顶插入一个元素)和"出栈"(将栈顶元素返回并从堆栈中删除).本题要求你实现另一个附加的操作: ...

  10. 阿里云 FaaS 架构设计

    摘要:希望通过本系列课程,让大家更深入了解阿里云FaaS架构设计,以及神龙高密部署的FaaS介绍. 本篇内容将从2个部分为读者介绍关于阿里云 FaaS 架构设计和神龙高密部署的 FaaS,希望可以让大 ...