WXOPEN Club

加入购物车动画怎么弄?

发布于 6 年前作者 yong069599 次浏览最后编辑 6 年前来自 issues

加入购物车动画怎么弄?  点击按钮  产品图片做动画  飞到购物车

我的想法是 点击按钮  然后获取产品图片 left top  然后 飞到 购物车 但是我没办法产品的 left top  

3 回复
daitao
daitao1 楼6 年前

你可以获取产品图片的实时位置，参考文档

const query = wx.createSelectorQuery()
query.select('#the-id').boundingClientRect()
query.selectViewport().scrollOffset()
query.exec(function(res){
  res[0].top       // #the-id节点的上边界坐标
  res[1].scrollTop // 显示区域的竖直滚动位置
})
xiajie
xiajie2 楼6 年前

每个按钮对应一个产品吧   然后产品图片和按钮的距离应该都是一样的

拿到按钮的位置可以对应产品的位置   生成一个图片   然后做飞向购物车的动画