搜索

首页  >  问答  >  正文

javascript - 移动端聚划算顶部导航的弹性滚动是怎么做的?

聚划算页面http://m.juhuasuan.com
顶部的横向滚动导航,滑到最后一个时,会有弹性,请问事怎么做的呢?
][1]

巴扎黑巴扎黑2818 天前606

全部回复(1)我来回复

  • 伊谢尔伦

    伊谢尔伦2017-04-10 16:19:36

    首先这里是用了transform: translate(-644px, 0px) translateZ(0px);
    来改变位置。
    然后通过transition: transform 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0s;
    来实现弹性动画的效果。
    原理上就是当拖动位置的距离大于宽度要求的极限值时,鼠标onMouseUp事件时把位置再拉回那个极限值。
    就是这样吧。

    回复
    0
  • 取消回复