                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /H5+JS+CSS3实现七夕言情

为何男孩转身了，女孩没有转身，这是出现了什么问题呢

慕仔8755223

2016-08-09

源自：H5+JS+CSS3实现七夕言情 7-4

关注问题我要回答

1225

操作

收起

2 回答

小呀嘛小白菜回答被采纳 +3 积分
2016-08-10

你看看是不是在pageC里面少了这段代码

/*小女孩*/

.girl {
background: url(http://img1.sycdn.imooc.com//55ade30d000100dc10570291.png) -755px -0px no-repeat;
position: absolute;
right: 40%;
top: 37%;
width: 151px;
height: 291px;
}

.girl-rotate {
-webkit-animation-name: girl-rotate;
-webkit-animation-duration: 850ms;
-webkit-animation-iteration-count: 1;
-webkit-animation-timing-function: step-start;
-webkit-animation-fill-mode: forwards;
-moz-animation-name: girl-rotate;
-moz-animation-duration: 850ms;
-moz-animation-iteration-count: 1;
-moz-animation-timing-function: step-start;
-moz-animation-fill-mode: forwards;
}

@-webkit-keyframes girl-rotate {
0% {
background-position: -604px -0px;
}
16.7% {
background-position: -151px -0px;
}
33.4% {
background-position: -906px -0px;
}
50.1% {
background-position: -0px -0px;
}
66.8% {
background-position: -302px -0px;
}
83.5% {
background-position: -453px -0px;
}
100% {
background-position: -604px -0px;
}
}

@-moz-keyframes girl-rotate {
0% {
/*background-position: -604px -0px;*/
}
16.7% {
background-position: -151px -0px;
}
33.4% {
background-position: -906px -0px;
}
50.1% {
background-position: -0px -0px;
}
66.8% {
background-position: -302px -0px;
}
83.5% {
background-position: -453px -0px;
}
100% {
background-position: -604px -0px;
}
}