vue动态绑定实现动画

这个需求是点击图标后图标向左位移一段距离的动画；刚好之前做过一个demo；

先看效果： 20190315_161152~1.gif

代码部分：

<--! 这是HTML里面的点击按钮图片路径；动态绑定两个样式 -->

<a v-on:click="show = !show">

    <img :class="{btn:show,btn1:!show}" src="/static/bh/btn2.png">

</a>

css部分：

.btn {

      position: fixed;

      width: 75px;

      left: 10px;

      top: 175px;

      transition-duration: 1.5s;

    }

    .btn1 {

      position: fixed;

      width: 75px;

      left: -37px;

      top: 175px;

      transition-duration: 1.5s;

    }