0

我有这个给定类的 DIV 元素：

.slideshow { background: white; width: 700px; height: 300px; padding:10px; margin: 0 auto; position: relative; box-shadow: 0px 0px 5px grey, 0px 10px 20px rgba(0,0,0,.1) inset; }

我定义了这两个伪元素（:before和:after）：

.slideshow:before, .slideshow:after { content: " "; background: green; width: 50%; height: 50%; position: absolute; z-index: -10; }

我的问题是这两个伪元素出现在我的 DIV 前面而不是后面。这种行为有什么具体原因吗？

这是一个示例：示例

Javascript 部分有点乱，但我仍在努力。

我还注意到，如果我删除所有 JS 部分，我就不再有这个问题了，但我认为代码中没有任何内容应该修改幻灯片DIV。

4

1 回答 1

0

已解决：问题出在我拥有的javascript部分：

$('.slideshow').css('-webkit-transform', 'rotate(0deg)');

删除这条线解决了我的问题。

我猜伪元素:before和:after与属性transform不是 100% 兼容。

于 2012-12-10T12:42:13.847 回答