キーフレームcssアニメーションの割合？

Question

バックグラウンドで左から右へ浮動するオブジェクトに次のコードを使用しようとしています。残念なことに、スクリーンから外れると、overflow-y: hidden属性がクラスに追加されていても、垂直スクロールバーが表示されます。私はパーセンテージ（100％移行）を試みたが、うまくいかなかった。私はそれが仮定されているか分からない？私は誰かが私にこの問題を解決する方法を教えてくれることを期待していました。上記のコメントに加えて

.largest-slowest { 
    border: solid 0px #2d2d2d; 
    text-align: center; 
    z-index: -1000; 
    background: #575757; 
    height: 50px; 
    width: 50px; 
    overflow-y:hidden; 
} 

.largest-slowest { 
    -webkit-animation: cssAnimation 12.7734s 16 linear; 
    -moz-animation: cssAnimation 12.7734s 16 linear; 
    -o-animation: cssAnimation 12.7734s 16 linear; 
} 
@-webkit-keyframes cssAnimation { 
    from {-webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(-100px);} 
    to { -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(2000px); } 
} 
@-moz-keyframes cssAnimation { 
    from { -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(-600px); } 
    to { -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(2000px); } 
} 
@-o-keyframes cssAnimation { 
    from { -o-transform: rotate(0deg) scale(1) skew(0deg) translate(-600px); } 
    to { -o-transform: rotate(0deg) scale(1) skew(0deg) translate(2000px); } 
} 

Answer 1

、あなたは.largest-slowestの親に代わりの.largest-slowest自体にoverflow-y: hiddenを追加する必要があります。 FYI

body { 
    overflow-y: hidden; 
} 

.largest-slowest { 
    border: solid 0px #2d2d2d; 
    text-align: center; 
    z-index: -1000; 
    background: #575757; 
    height: 50px; 
    width: 50px; 
}