111Two-State Drag Gallery

In this effect, we’ll browse a horizontal strip of images. The focused one scales up in the center while the others tuck toward the edges. Drag to explore, or let autoplay move forward!

HTML Structure

The structure is relatively simple. We have two labels and a horizontal strip of images inside a container:

<section class="mwg_effect111">
    <div class="text-state-1"></div>
    <div class="text-state-2"></div>

    <div class="container">
        <div class="content">
            <img class="media" src="./assets/medias/02.png" alt="" data-text="Silent Matter Shop">
            <img class="media" src="./assets/medias/03.png" alt="" data-text="Satisfy Running">
            <img class="media" src="./assets/medias/04.png" alt="" data-text="Poolsuite FM">
            …
        </div>
    </div>
</section>

Become a member to unlock
the full effect
today.

Join now Join now

Get started with free effects

Get a taste of what’s possible with Made With Gsap, completely free

Try it now Try it now

No credit card or account required.
Free for everyone.