动态下拉小箭头

 <div class="pull">

      <img class="pull1" :src="ossPath + 'img/index/pull.png?v2'" alt="" />

      <img class="pull2" :src="ossPath + 'img/index/pull.png?v2'" alt="" />

      <img class="pull3" :src="ossPath + 'img/index/pull.png?v2'" alt="" />

    </div>

 

css

  .pull {

    position: absolute;

    top: calc(1940vw / 11.25);

    left: calc(536vw / 11.25);

    width: calc(53vw / 11.25);

    height: calc(75vw / 11.25);

    .pull1 {

      width: calc(53vw / 11.25);

      height: calc(27vw / 11.25);

      animation: pull 1s linear infinite;

    }

    .pull2 {

      width: calc(53vw / 11.25);

      height: calc(27vw / 11.25);

      animation: pull 1s linear infinite;

      animation-delay: 0.2s;

    }

    .pull3 {

      width: calc(53vw / 11.25);

      height: calc(27vw / 11.25);

      animation: pull 1s linear infinite;

      animation-delay: 0.4s;

    }

    @keyframes pull {

      from {

        opacity: 1;

      }

      to {

        opacity: 0.2;

      }

    }

  }