想让老师指点我一下锤子官网的那个轮播图大体思路
来源:6-7 首页 - 幻灯片组件(2)

子羊学长
2017-09-26
锤子官网那个轮播图是我见过最炫酷的轮播方案,一直想实现但是水平有限,找不到思路。希望老师能指点一二。
写回答
2回答
-
达文西H
2017-09-26
我感觉是通过offsetX/offsetY来获取鼠标在轮播图中的坐标位置,再根据这个坐标值进行css3中的3D转换
20 -
fishenal
2017-09-27
你是说移动过去跟个平面似的那个对吧。看了一下锤子官网是用angular.js做的,这个特效主要是基于.banner-3d 这个类,用到的css3的属性 应该是 perspective (https://developer.mozilla.org/en-US/docs/Web/CSS/perspective) 配合过渡transition, 重点应该是监听了mouseover事件,根据鼠标坐标更改了perspective或者 transform?的属性,这个具体要研究一下文档,实践一下
112017-09-27
相似问题