立即注册
 找回密码
 立即注册

梦幻岛

搜索
热搜: 活动 交友
返回列表
查看: 316|回复: 1

小程序获取节点位置,页面定位处理

[复制链接]

35

主题

35

帖子

304

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
304
发表于 2019-6-27 16:02:30 | 显示全部楼层 |阅读模式

最近做商城,商品详情页都会有导航栏点击直接使页面滚动到想要指定的位置,尤其商品页很长的情况,这样就需要知道某个节点的位置。

用下边这个方法可以获取:


image.png



var query = wx.createSelectorQuery();

query.select('#container').boundingClientRect();

query.select('#tj').boundingClientRect();

query.select('#productview').boundingClientRect();

query.exec(function(res) {

if (res[0].bottom > 0) {

that.setData({

swiperheight: res[0].bottom,

})

}

if (res[1].bottom > 0) {

that.setData({

tjposition: res[1].bottom + res[1].height,

})

}

if (res[2].top > 0) {

that.setData({

detailposition: res[2].top,

})

}

})


创建selector之后,为想要到的位置进行id绑定及select查询节点信息

很简单,多个select由一个exec集中处理,完事循环拿到每个select节点的位置数据,包括top,bottom,height数据

想要滚动到某个节点的头位置就用top,尾位置就用bottom


另外注意的是,为了拿到准确的节点数据,把获取位置的处理放在onReady()方法中,这样待页面加载之后,这些节点的数据就对了。


附页面滚动到指定位置代码:

wx.pageScrollTo({

scrollTop: this.data.detailposition

})


回复

使用道具 举报

0

主题

6

帖子

16

积分

新手上路

Rank: 1

积分
16
发表于 2020-6-12 10:17:32 | 显示全部楼层
啥按个啊是发个公司大股东非固定盖板打开过哪里打开固定放开那个路口彩票哪里看哪个理科女生看两福彩双色球个奴隶少女老师那里还能弄好了思路和幸运飞艇你说了看到你浪费了给你说了的可能离开谁对你好的哈;还是电脑坏了可能是登录河南省来得快年历史的你好可怜迪士尼
回复

使用道具 举报

返回列表
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表