애니메이션 이미지가 뒤쪽에 있고 정적 이미지가 겹치는 두 이미지가 서로 겹치기를 원합니다. 애니메이션이 없으면 검은 색 이미지가 겹치는 빨강 색으로 잘 작동합니다.CSS 애니메이션이 Z- 인덱스를 무시합니다.
CSS 애니메이션을 추가하자마자 Z- 색인 세트가 무시되고 검은 색이 빨간색으로 겹칩니다. 빨간 이미지를 앞에 가져 오려면 어떻게해야합니까?
나는 CSS 배경을 사용하여 작업 솔루션을 가지고 있지만 나는 이미지가 여기에
여기
http://jsfiddle.net/52VtD/7992/
CSS
.rotate{
z-index: 1;
-webkit-animation:rotation 20s linear infinite;
-o-animation:rotation 20s infinite linear;
-moz-animation:rotation 20s infinite linear;
animation:rotation 20s infinite linear;overflow:visible;}
@keyframes rotation{0%{}100%{transform:rotate(-360deg);}}@-moz-keyframes rotation
{
0% {}
100% {transform: rotate(-360deg);}}
@-webkit-keyframes rotation
{
0% {}
100% {-webkit-transform: rotate(-360deg);}
}
@-o-keyframes rotation
{
0% {}
100% {-webkit-transform: rotate(-360deg);}
}
.static {
z-index:10;
margin-top: -232px;
}