vue 无缝滚动

最新推荐文章于 2024-08-29 11:01:36 发布

性野喜悲

最新推荐文章于 2024-08-29 11:01:36 发布

阅读量106

点赞数

分类专栏： vue 经验分享

本文链接：https://blog.csdn.net/leng0920/article/details/117564965

版权

经验分享同时被 2 个专栏收录

149 篇文章 1 订阅

订阅专栏

vue

136 篇文章 4 订阅

订阅专栏

<template>
  <div class="logo_wrap">
    <div class="line_even">
      <img class="logo_img" src="https://lhcdn.lanhuapp.com/home/img/logo_four.png" alt="" srcset="">
      <img class="logo_img" src="https://lhcdn.lanhuapp.com/home/img/logo_four.png" alt="" srcset="">
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style>
.logo_wrap {
  position: relative;
  width: 1440px;/*no */
  height: 644px;/*no */
  overflow: hidden;
  margin: 0 auto;
  font-size: 0;
}
.line_even {
  animation: scrollToRight 5s linear infinite;
  display: flex;
  width: 3976px;/*no */
}
@keyframes scrollToRight {
  0% {
    transform: translate3d(-50%, 0, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}
.logo_img {
  display: inline-block;
  width: 50%;
  height: 100%;
}
</style>