继续将元素转换为其他元素

Question

我正在学习使用CSS3 3D变换,但是我无法保留在所有其他元素之上转换的元素.

这是我到目前为止:http://bos.rggwebdesigns.com/

如您所见,该站点遵循三个.row div的层次结构的标准z-index规则,这意味着第一行中的卡位于第二行中的卡后面,依此类推.

我尝试在变换脚本中添加行(在main.js中),它选择单击的.card元素上方的.row元素并将其z-index设置为1000,但这似乎不起作用.

$(document).ready(function() {
    $('.card').click(function() {
        $('.row').removeClass('top');
        $('.card').not(this).removeClass('flipped');
        $(this).parents().eq(2).toggleClass('top');
        $(this).toggleClass('flipped');
    })
});

重申一下,我正在努力确保转换元素的所有部分始终显示在每个其他元素之上.

Answer 1

据我所知，z-index 需要是相对的。因此，如果您设置position : relative;类“行”，应该可以解决您的问题。

编辑： 我正在审查你的代码。您还需要将.row.topcss 更改为.top