我的一个 CSS 动画有一些问题,但有两个效果很好。他们都在本地工作得很好,但是当我把它放在我的 wordpress 页面上时,有两个 dosent 工作。有人知道问题是什么吗?
我的 CSS(只有动画不起作用):
.start{
-webkit-animation-name: start;
-webkit-animation-duration: 2000ms;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-play-state: running;
-webkit-animation-direction: reverse;
-moz-animation-name: start;
-moz-animation-duration: 2000ms;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: ease-in-out;
-moz-animation-play-state: running;
-moz-animation-direction: reverse;
-ms-animation-name: start;
-ms-animation-duration: 2000ms;
-ms-animation-iteration-count: infinite;
-ms-animation-timing-function: ease-in-out;
-ms-animation-play-state: running;
-ms-animation-direction: reverse;
animation-name: start;
animation-duration: 2000ms;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
animation-play-state: running;
animation-direction: reverse;
}
@-ms-keyframes start {
from { -ms-transform: translateX(0px); }
50% { -ms-transform: translateX(-100px); }
to { -ms-transform: translateX(0px); }
}
@-moz-keyframes start {
from { -moz-transform: translateX(0px); }
50% { -moz-transform: translateX(-100px); }
to { -moz-transform: translateX(0px); }
}
@-webkit-keyframes start {
from { -webkit-transform: translateX(0px); }
50% { -webkit-transform: translateX(-100px); }
to { -webkit-transform: translateX(0px); }
}
@keyframes start {
from {
transform: translateX(0px);
}
50% {
transform: translateX(-100px);
}
to {
transform: translateX(0px);
}
}
/*************************
Animationer - stop
**************************/
.stop{
-webkit-animation-name: start;
-webkit-animation-play-state: paused;
-moz-animation-name: start;
-moz-animation-play-state: paused;
-ms-animation-name: start;
-ms-animation-play-state: paused;
animation-name: start;
animation-play-state: paused;
}
最佳答案
对不起,睡一觉对我很好。发现我的 javascript 代码有一点点错误。不知道为什么它在我的电脑上(在 wordpress 之外)仍然有效,但至少我现在发现了问题!
关于在 Wordpress 站点中使用关键帧进行 CSS 动画/转换,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25125477/