小编Sir*_*man的帖子

我正在制作一个流畅的动画条纹div,就像进度条一样.

CSS:

.animationStripes{
  width: 300px;
  height: 50px;
  background-image: repeating-linear-gradient(-45deg, rgb(0, 0, 0), rgb(0, 0, 0) 25px, blue 25px, blue 50px);
  -webkit-animation:progress 2s linear infinite;
  -moz-animation:progress 2s linear infinite;
  -ms-animation:progress 2s linear infinite;
  animation:progress 2s linear infinite;
}
@keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -70px 0px;
  }
} 

http://plnkr.co/edit/4wPv1ogKNMfJ6rQPhZdJ?p=preview

问题是背景图像渐变的右侧存在奇怪的错位.我如何解决这个错位？