Back

ImageCompare

Drag to Compare

Drag the handle left and right to reveal the before/after images.

Edited
Original
Original Edited

Custom Position (75%)

Night
Day
Day Night

Usage

// Wrap in a container with a fixed height
<div style="height: 400px;">
    @media.ImageCompare(media.ImageCompareProps{
        Before:      "/img/before.jpg",
        After:       "/img/after.jpg",
        BeforeLabel: "Before",  // default "Before"
        AfterLabel:  "After",   // default "After"
        Initial:     50,        // divider start position 0–100
    })
</div>