CSS3图像滑块：悬停时，暂停按钮不会出现在IE中

Question

这是我建造的第一个网站，所以对我来说很容易！

我在线教程中构建了这个CSS3图像滑块，效果很好。它从右向左滑动，使滑块外的图像保持隐藏状态，直到它们滑入。悬停时，滑块暂停动画，图像上方会出现一个暂停按钮，一旦悬停就会消失。除了IE之外，所有浏览器都能很好地工作，暂停按钮不会显示。

有什么想法吗？！？！我正在撕裂我的头发！

这是暂停按钮动画的CSS，

div#css3slider:hover {
-webkit-animation-play-state: paused;
-moz-animation-play-state: paused;
-o-animation-play-state: paused;
animation-play-state: paused;
}}

div#css3slider img {
float: right;
}

div#slidercontainer:after {
content: "❚❚";
font-size: 165px;
color: rgba(255,255,255,0.0);
-webkit-transition: 1s;
-ms-transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
transition: 1s;
left: 550px;
top: 130px;
position: absolute;
-webkit-text-stroke: 0.8px  rgba(255,255,255,0.0);
}

div#slidercontainer:hover:after {
color: rgba(255,255,255,0.6);
-webkit-text-stroke: 1px black;
-webkit-animation-play-state: paused;
-moz-animation-play-state: paused;
-o-animation-play-state: paused;
animation-play-state: paused;
}