CSS 3 Perspective and z-index incompatibility

Question

i have an slider and for cube effect i use css3's perspective:xxx; But when my element get value of perspective it and child elements loose added them z-index values, so mi images appearing in bottom of other elements.

element.style {
-webkit-perspective: 1000px;
}

I have removed given value of element after effect and it bring z-index values back .. but with other reason i cant remove it. So what can i do to not let to perspective affect on z-indexes ?

Here is an example http://prognozplus.ru/144/ As you can see after first effect image loose the pointer cursor because other transparent elements covering it. Find class="huge_it_slide_bg" element and remove perspective style and pointer will appear again.

Answer 1

Since i was free. i made a cube effect maybe what you were looking for so take a look i am sure you will find code that can help you out in whatever else effect you are trying to get.

demo

http://jsfiddle.net/techsin/nbed7/

$('input[type=range]').change(function (e) {
    $('.box').css('transform','rotateY('+($(this).val()/100)*360+'deg) rotateX(20deg)');
});