使用translate实现位移功能，当点击的时候，2个图片向相对的位置移动，并且实现点击翻转，就可以实现各种相关操作。
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="jquery.min.js"></script>
<style type="text/css">
.father{
margin: 200px 200px;
}
.left{
float: left;
}
.current{
transform: translate(-100%,0);
}
.current1{
transform: translate(50px,0);
}
</style>
</head>
<body>
<div class="father">
<div class="left"> <img src="1.png" alt=""></div>
<div class="right"> <img src="2.png" alt=""></div>
</div>
<button class="btn2">打开关闭</button>
<script>
$(function(){
$('.btn2').click(function(){
$(".left").toggleClass('current'); // 标准
$(".right").toggleClass('current1'); // 标准
})
})
</script>
</body>
</html>
