遇见更好的自己

原创 js实现滑动门效果

滑动门效果： 原理：一共四道门，初始情况下，第一道门打开，其他三道门关闭，如第一个图所示。 假设图片的宽度是120px，其他三道门露出的宽度是80px， 初始状态下， 第二道门左边的距离是120px, 第三道门左边的距离是200px, 第四道门左边的距离是280px。 当第二道门打开时， 第二道门左边的距离是80px，为（120-40）px 第三道和第四道门左边的距离不变。