Загрузочная флип-карта с трансформацией css3

Я хочу создать загрузочную флип-карту с помощью преобразования CSS3. Я начал с этогорабочий и базовый пример

Однако я хотел изменить это, чтобы иметь карту фиксированной высоты и некоторое незначительное улучшение. В частности, мне нужно было перевернуть карту, когда пользователь нажимает на иконку, которую я создал в правом верхнем углу.

Я изменил код, как вы можете видетьВот.

Проблема в том, что карта не переворачивается на передний план после правильного переворачивания на заднюю сторону.

Кто-нибудь может предложить какое-либо решение?

НОТА: проблема, кажется, с кодом jquery. На самом деле у меня есть

$('div.flipControl').on('click', function () {
    $(this).closest('div[class="card"]').toggleClass('flipped');
});

Но если я изменю это с

$('div.flipControl').on('click', function () {
    $(this).parent().parent().parent().toggleClass('flipped');
});

Все работает как положено.

Ответы на вопрос(1)

Ваш ответ на вопрос