我试图将文本从网站的一侧滑到另一侧，然后消失

Question

我试图建立一个从右到左显示一些文字的网站。
我想要做的一个很好的例子就是这个网站的背景realtimebitcoin.info。
我不太清楚从哪里开始。
任何建议都将不胜感激。

谢谢，
丹尼尔

Answer 1

您可能会想要使用选框标记，它会以您希望的方式为文本设置动画。但是，该标记已弃用，可能会在不同的浏览器中产生意外结果。这是一个JSFiddle HTML

<span>Hello World</span>

CSS

span {
  display: inline-block;
  position: relative;
  animation: marquee 3s infinite;
}
@keyframes marquee {
  0% {left: 500px}
  50% {left: 200px}
  100% {left: -100px}
}

使用动画关键帧来获得所需的精确滚动效果。

Answer 2

＆＃13;

＆＃13;

.animated {
  position:relative;
  animation: animate 2s infinite;
}
@keyframes animate{
  0% {left: 100%}
  100% {left: 0%}
}

＆＃13;

<div class="animated">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem sapiente quisquam optio iusto consectetur recusandae voluptatibus quis mollitia dolore vitae perspiciatis, doloribus cumque, incidunt corporis, labore veritatis asperiores aliquid animi.</div>

＆＃13;

＆＃13;

＆＃13;