css - CSS3 marquee effect performance issues -


i scroll text translate3d, effect suffers performance issues. additional effects running @ same, sometimes text not scrolling smoothly, fast computer. ideas improvements?

jsfiddle

html:

<p><span>lorem ipsum...</span></p> 

css:

p {     box-sizing: border-box;     margin: 0 auto;     overflow: hidden;     white-space: nowrap; }  span {     -webkit-animation: marquee 70s linear infinite;     display: inline-block;     padding-left: 100%; }  @-webkit-keyframes marquee {     0% {         -webkit-transform: translate3d(0, 0, 0);     }     100% {         -webkit-transform: translate3d(-100%, 0, 0);     } } 


Comments

Popular posts from this blog

google chrome - Developer tools - How to inspect the elements which are added momentarily (by JQuery)? -

angularjs - Showing an empty as first option in select tag -

php - Cloud9 cloud IDE and CakePHP -