CSS 애니메이션 배경

Question

그래서 나는 최근 CSS3의 정말 흥미로운 애니메이션 기능을 발견하고 내 웹 사이트의 배경에 애니메이션을 적용 전체 페이지에 적용되지 않습니다

http://ryanhammond.us/

그것으로 내 문제가 있다는 것입니다

애니메이션은로드 할 때 브라우저 창에서 볼 수있는 페이지 부분에만 적용됩니다. 위의 링크로 이동하여 아래로 스크롤하면 배경 이미지가 웹 사이트의 맨 위에 표시되지만 페이지 아래로 스크롤하면 안됩니다.

이 방법을 사용하면 bg 애니메이션이 전체 페이지에 적용됩니다.

는 여기와 관계있는 내 CSS 코드의 일부입니다 : 크롬을 사용

body 
{ 
background-image:url('images/patterntest2.jpg'); 
background-repeat:repeat; 
-webkit-animation:bgscroll 20s infinite linear; 
    -moz-animation:bgscroll 20s infinite linear; 
    -ms-animation:bgscroll 20s infinite linear; 
    -o-animation:bgscroll 20s infinite linear; 
     animation:bgscroll 20s infinite linear; 
} 

/*//////////////////////////////////////////////// 
-------------------------------------------------- 
* Animations 
-------------------------------------------------- 
////////////////////////////////////////////////*/ 

@-webkit-keyframes bgscroll { 
from {background-position:0 0;} 
to {background-position:0 -520px;} 
} 

@-moz-keyframes bgscroll { 
from {background-position:0 0;} 
to {background-position:0 -520px;} 
} 

@-ms-keyframes bgscroll { 
from {background-position:0 0;} 
to {background-position:0 -520px;} 
} 

@-o-keyframes bgscroll { 
from {background-position:0 0;} 
to {background-position:0 -520px;} 
} 

@keyframes bgscroll { 
from {background-position:0 0;} 
to {background-position:0 -520px;} 
} 

Answer 1

, 그것은뿐만 아니라 나를 위해 잘 작동합니다. 당신은 문제가있는 경우 는하지만, 난 당신이

background-size: cover; 

설정을 시도 할 수 그리고 아마 그 문제를 해결할 것 같아요.