vue 怎么实现箭头向右滚动渐隐呢？

Question

效果如下图所示：
这三个箭头依次向右滚动，而这三个我用的是背景图，分别加在span标签上，那么怎么实现最方便呢？

HTML:
 <div class="arrowDiv" v-show="showArrowDiv">
          <span></span>
          <span></span>
          <span></span>
        </div>

Answer 1

• 调整opacity 加 filter
• 用font 直接调整color
• 渐变

Answer 2

rgba, 调整opacity即可。

Answer 3

http://jsrun.net/3ChKp/edit

三个或者四个去实现，位置的变化，透明度的变化

Answer 4

gif图 最方便