Join Join
Join

056Dual stack flip

Two decks share the same stage: one is image-only, the other pairs a short line with each picture. The two stacks weave past each other in depth, trade angles, then ease through a quick wobble before the next hand-off. Let's dive in!

HTML Structure

Two card stacks share the same stage. A tall wrapper gives us scroll room, a centered frame holds two sibling strips, and every slide is a .media block stacked in the same slot:

<section class="mwg_effect056">
    <div class="pin-height">
        <div class="container">
            <div class="medias medias-a">
                <div class="media"><img src="assets/medias/1.png" alt=""></div>
                <div class="media"><img src="assets/medias/6.png" alt=""></div>
                ...
            </div>
            <div class="medias medias-b">
                <div class="media">
                    <p>…</p>
                    <img src="assets/medias/5.png" alt="">
                </div>
                ...
            </div>
        </div>
    </div>
</section>

The left strip (medias-a) only carries images. The right strip (medias-b) repeats the same count but nests a line of copy above each image, so both rails stay structurally parallel.

Become a member to unlock
the full effect today.

Join now Join now

Discover the platform

See how the platform works: try Effect #000 for free.

Try it now Try it now

(No registration or credit card needed)