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

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

<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. OpenMetric与时序数据库模型之主流TSDB分析

    摘要:为大家带来当下时序数据模型的主流TSDB分析及云厂商在时序数据模型方面的最新动态. 本文分享自华为云社区<[万字干货]OpenMetric与时序数据库存储模型分析(下)>,作者:敏捷 ...

  2. 源码详解数据结构Linked List

    摘要:java.util.LinkedList 是 Java 集合框架中的成员之一,底层是基于双向链表实现,集合容量可动态变化的. 本文分享自华为云社区<LinkedList 源码分析>, ...

  3. 实践GoF的23的设计模式:SOLID原则(下)

    摘要:本文将讲述SOLID原则中的接口隔离原则和依赖倒置原则. ​本文分享自华为云社区<实践GoF的23的设计模式:SOLID原则(下)>,作者:元闰子. 在<实践GoF的23种设计 ...

  4. OGC标准WMTS服务概念与地图商的瓦片编号流派-web地图切片加载

    还不知道地图栅格化切片等相关GIS原理的,推荐阅读<webGIS底图栅格化与实时数据合成处理原理,地图API设计,xyz加载> OGC概念 OGC全称--开放地理空间信息联盟(Open G ...

  5. 如何打造企业专属 A/B 平台?火山引擎 DataTester 开放平台技术揭秘

    更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 企业为什么需要开放平台 开放平台对于企业与业务来说,做到的不仅是能力的开放.生态的开放,与此同时还要能提供完善的业 ...

  6. 告别数据开发中的人工审核!火山引擎 DataLeap 落地“自动校验开发规范”能力

    更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 近期,火山引擎 DataLeap 智能市场上线"数仓建表规范"功能,该功能通过规范数仓场景下的 ...

  7. 微信公众号短链实时阅读量、点赞数爬虫(不会Hook可用)

    众所周知,微信分享的公众号分享出的一般都是短链,在这个锻炼下使用浏览器打开并不能获取微信公众的阅读量点赞数等这些信息,如图1所示. 但是实际拥有详细信息的则是这个链接下面,提取链接所需要提交的信息包括 ...

  8. CMakeLists.txt的工程转成.sln

    直接说正确的操作(结合之前的笔记) 创建 Build 目录 mkdir build && cd build 执行 cmake 命令,根据 CMakeLists.txt 生成 .sln ...

  9. Codeforces Round #719 (Div. 3) A~E题解

    51鸽了几天,有几场比赛的题解还没发布,今天晚上会补上的 1520A. Do Not Be Distracted! 问题分析 模拟,如果存在已经出现的连续字母段则输出NO using ll = lon ...

  10. 五、java操作swift对象存储(官网样例)

    系列导航 一.swift对象存储环境搭建 二.swift添加存储策略 三.swift大对象--动态大对象 四.swift大对象--静态态大对象 五.java操作swift对象存储(官网样例) 六.ja ...