头像或者文字向上无线滚动

 <div class="left">
        <ul :class="animate?'anim':''">
          <li v-for="(item,index) in user_list" :key="index+'s'">
            <img :src="item.userImg" alt="">
            <span>{{item.userNickName}}</span>
          </li>
        </ul>
  </div>

  data(){
      return {
          user_list:[
              {userImg:'' , userNickName:'123'},
              {userImg:'' , userNickName:'123'},
              ]
          }
      }

created(){

    setInterval(this.scroll,2000)

}

methods:{

scroll(){

       this.animate=true; 

       setTimeout(()=>{ 

          let item=this.user_list.shift(); 

          this.user_list.push(item);

          this.animate=false; 

       },3000)

    },

}

 

.anim{

    transition:all 1.5s;

    margin-top: -60px;

}