如何避免我的水平动画自动收报机从页面重新加载开始

时间:2019-04-11 18:10:48

标签: css3 css-animations

在下面的代码中,我正在使用@ -keyframe和动画来生成水平文本行情自动收录器。每当我重新加载页面或导航到另一页面时,置顶栏就会重新开始。如何使自动收报器无缝地继续运行,而与页面重新加载无关?

.ticker_text {
  position: relative;
  color: #d5d5d5;
  font-family: helvetica;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 1px;
  -webkit-animation: mymove 30s infinite;
  animation-timing-function: linear;
  animation-play-state: running;
  padding-top: 8px;
}

@-webkit-keyframes mymove {
  0% {
    left: 2000px;
  }
  100% {
    left: -1000px;
  }
}
<div class="ticker">
  <p class="ticker_text">Local Weather - News - Information - Networking - Events . . .</p>

  <p class="ticker_text">Tell us what <em>YOU</em> want in this website by clicking on <span class="ticker_text_green">Suggestion"</span> above . . .</p>
</div>

0 个答案:

没有答案