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; }

これらの2つの疑似要素(:before:after)を定義します。

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

私の問題は、これら2つの疑似要素がDIVの後ろではなく、前に表示されることです。この動作の具体的な理由はありますか?

次に例を示します。

Javascriptの部分は少し厄介ですが、私はまだそれに取り組んでいます。

また、JSの部分をすべて削除しても、この問題は発生しなくなったことに気づきましたが、スライドショーDIVを変更する必要のあるコードはないと思います。

4

1 に答える 1

0

解決済み:問題は、私が持っているjavascriptの部分にあります:

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

この行を削除すると、私の問題は解決しました。

疑似要素:before:afterは、プロパティ変換と100%互換性がないと思います。

于 2012-12-10T12:42:13.847 に答える