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

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

<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. 13个VSCode使用技巧,开启高效的开发模式

    摘要:VsCode是一款开源的编辑器,拥有强大的功能,.由于拥有各种各样的插件,这就使得VsCode可以做到的事情更多了.在使用的过程中,也是有很多技巧的,掌握一些技巧对于后期写代码也会轻松很多. 本 ...

  2. 论文解读丨无参数的注意力模块SimAm

    摘要:本文提出了一个概念简单但对卷积神经网络非常有效的注意力模块. 本文分享自华为云社区<论文解读系列三十:无参数的注意力模块SimAm论文解读>,作者:谷雨润一麦. 摘要 本文提出了一个 ...

  3. 5步带你掌握工作流Activiti框架的使用

    摘要:本文通过一个工作流Activiti框架的具体使用示例,具体详尽的介绍了工作流Activiti框架的使用方式. 本文分享自华为云社区<一个使用示例,五个操作步骤!从此轻松掌握项目中工作流的开 ...

  4. 本地已存在jar包,maven打包还是去下载

    解决方法 在pom文件里面添加以下: file后修改为本地仓库的位置 oss file:C:\Users\admin\.m2\repository <pluginRepositories> ...

  5. Interceptor Handle 执行顺序

    preHandle 调用时间:Controller方法处理之前 执行顺序:链式Intercepter情况下,Intercepter按照声明的顺序一个接一个执行 若返回false,则中断执行,注意:不会 ...

  6. Codeforces Round #677 (Div. 3) (A - E题题)

    1433A. Boring Apartments #include <bits/stdc++.h> using namespace std; int main() { int t; cin ...

  7. 关于 Serverless 应用架构对企业价值的一些思考

    作者:寒斜 前言 对于企业方而言,最关心的核心诉求就是如何能获取更多的营收,更高的利润,通俗点说就是如何赚更多的钱:企业赚钱的方式主要是通过出售企业服务,当用户购买更多的企业服务,企业赚的钱就越多:而 ...

  8. vue 状态管理 二、状态管理的基本使用

    系列导航 vue 状态管理 一.状态管理概念和基本结构 vue 状态管理 二.状态管理的基本使用 vue 状态管理 三.Mutations和Getters用法 vue 状态管理 四.Action用法 ...

  9. windows不安装虚拟机如何使用Linux系统作为开发工具?

    哈喽,大家好,我是仲一.作为嵌入式开发程序员,常常需要在Linux环境下编译一些代码.安装虚拟机比较方便,但是,太占用内存了.性能不好的电脑开了一台虚拟机后,可能就干不了其他事情了.安装双系统也比较麻 ...

  10. Vue项目中使用 tinymce 富文本编辑器的方法,附完整源码

    Vue项目中使用 tinymce 富文本编辑器的方法,附完整源码 https://blog.csdn.net/snsHL9db69ccu1aIKl9r/article/details/11432414 ...