首页 > 解决方案 > 为什么文字会随着动画图像上下移动?

问题描述

我在一行上有图像和文字。图像是动画的,它会上下移动,但文本应该是稳定的,但它会随着图像移动。只有当文本的高度较小时,才会发生这种情况。我不希望图像很小。有没有办法解决这个问题?这是我的代码:

export default {
  name: "cover",
  data() {
    return {
      logo_an: true
    };
  },
  components: {},
  mounted() {
    setInterval(
      function() {
        this.logo_an = !this.logo_an
      }.bind(this),
      500
    );
  },
  methods: {
    go() {
      window.open('...', "_blank");
    }
  },

};
img.start {
  margin-top: -5px;
}
<b-container fluid class="d-none d-lg-flex">
  <div class="row row-eq-height">
    <div class="col-lg-6 back_cover pmy ">
      <img src="@/assets/logo.png" alt="" :class="{'start': logo_an}">
    </div>
    <div class="col-10 offset-1 offset-lg-0 col-lg-4 col-xxl-3 text-left pmy info ">
      <div class="date">31.05</div>
      <div class="time mt-3" style="margin-top:-5px;">11:30 - 16:00</div>
      <p>According to a new Gallup survey of over 2,000 college graduates, 80 percent believe it’s very or extremely important to have a sense of purpose in their work. Yet fewer than half of them actually succeed in having this experience.It’s not surprising
        that young people are seeking purpose—adolescents with greater purpose experience greater well-being and hope.</p>
      <p>Purpose is an abiding aim that directs your behavior, provides a sense of meaning in life, and (under some researchers’ definitions) matters to the world beyond the self.</p>
      <p>Even conflict in relationships between parents and children could affect their sense of purpose as they grow older.</p>
      <div class="btn_my mt-3" @click="go">Go</div>
    </div>
  </div>
</b-container>

标签: cssvue.jsanimation

解决方案


推荐阅读