2015-01-27 3 views
0

У меня есть этот очень простой код для имитации работы marquee.it во всем браузере, кроме Chrome. Я пробовал -webkit-, но все равно не повезло, и то, что сводит меня с ума, это когда я пытаюсь здесь http://jsfiddle.net/XxUXD/2566/, он работает как шарм на Chrome. Не могли бы вы рассказать мне, что я сделал не так?keyframe не работает на 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 } 
} 
+0

К сожалению мой предыдущий комментарий, в следующий раз я буду читать весь вопрос. Что находится на вашем фактическом сайте, который не находится в вашем jsfiddle? Трудно ответить на вопрос, когда вы говорите, что это работает где-то, что мы можем проверить, но не будем работать там, где мы не можем видеть. –

+0

нет разницы между кодом, который я использую на своем сайте, и на jsfiddle. вы можете скопировать код, который я вставил в любой пустой html-файл, и вы увидите, что я имею в виду. –

+0

40.0.2214.91 m. Обновления контролируются здесь на работе, иначе я бы перешел к вашей версии для абсолютного подтверждения. Но ваш jsfiddle работает так же, как вы говорите. –

ответ

0

Необходимо использовать -webkit- в данном случае.

Это означает, что для -webkit-animation, @-webkit-keyframes и webkit-animation-play-state.

Смотрите следующий JSFiddle: http://jsfiddle.net/nd3oebsb/

+0

спасибо, что это работает. –

+0

Если бы я ответил на ваш вопрос, просьба указать это, указав мне галочку на моем посту. Благодарю. – Himmel