0

次のコードがあります。

        .picTransition .item {
  position: absolute;
  left: 0;
  right: 0;
  opacity: 0;
  -webkit-animation: picTransition 56s linear infinite;
  -moz-animation: picTransition 56s linear infinite;
  -ms-animation: picTransition 56s linear infinite;
  animation: picTransition 56s linear infinite;
}

.picTransition.paused{
    -webkit-animation-play-state:paused;
    -moz-animation-play-state:paused;
    -o-animation-play-state:paused; 
    animation-play-state:paused;
}

.picTransition .item:nth-child(2) {
  -webkit-animation-delay: 14s;
  -moz-animation-delay: 14s;
  -ms-animation-delay: 14s;
  animation-delay: 14s;
}
.picTransition .item:nth-child(3) {
  -webkit-animation-delay: 28s;
  -moz-animation-delay: 28s;
  -ms-animation-delay: 28s;
  animation-delay: 28s;
}
.picTransition .item:nth-child(4) {
  -webkit-animation-delay: 42s;
  -moz-animation-delay: 42s;
  -ms-animation-delay: 42s;
  animation-delay: 42s;
}

スライドを一時停止する方法を間違えています。animation-play-state: paused を使用しましたが、機能しません。jquery関数を使用できますが、これをcssでのみ機能させたいと思っています。私は親子関係をめちゃくちゃにしていますか？または、このタイミング シーケンスはサポートされていないか、一時停止の問題を台無しにしていますか? おそらく、ホバータイプの一時停止を行い、そのために新しいdivを作成する必要がありますか? 私は単純な間違いを犯していることを知っています。

4

1 に答える 1