Question

我有这个非常简单的代码来模拟一个除了Chrome之外的所有浏览器上的marquee.it＆。我尝试了-webkit-但仍然没有运气，让我疯狂的是当我在这里尝试http://jsfiddle.net/XxUXD/2566/时，它就像Chrome上的魅力一样。那么请你告诉我我做错了什么？

HTML

<div class="marquee">  the brown fox jumped over the lazy dog </div>

CSS

   /* Make it a marquee */
.marquee {

    width:100%;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    animation: marquee 50s linear infinite;
}

.marquee:hover {
    animation-play-state: paused
}

/* Make it move */
@keyframes marquee {
    0%   { text-indent: 27.5em }
    100% { text-indent: -105em }
}

Answer 1

在这个例子中有必要使用-webkit-。

这意味着-webkit-animation，@-webkit-keyframes和webkit-animation-play-state。

请参阅以下JSFiddle： http://jsfiddle.net/nd3oebsb/

关键帧无法在Chrome上运行

1 个答案: