> For the complete documentation index, see [llms.txt](https://help.parta.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.parta.io/editor/edit-elements/set-interactive-elements/slide-reveal.md).

# Slide reveal

An interactive element that hides/reveals content when the slider is being moved.

<figure><img src="/files/15EFx3bKyFAKgelrH6Ah" alt=""><figcaption></figcaption></figure>

#### Double-click on an element to view its settings.

<figure><img src="/files/UegD82mdyMuSORF9BW9k" alt=""><figcaption></figcaption></figure>

### 1. Default slider position

To set default slider position, set the value from 1 to 100 in the property **slider**.

<figure><img src="/files/pzjYhnMGEZ2XG0iCuDdN" alt=""><figcaption></figcaption></figure>

### 2. Change image

To change the image, click on the image file's name and select or [upload ](broken://pages/1zjSTjH7pgMiPT2FRC83#upload-resources)new image.

<figure><img src="/files/QAq8kN2xgzdot45x88Qg" alt=""><figcaption></figcaption></figure>

### 3. Crop image

You can crop the image in slide reveal [just like you would with the image element](#id-3.crop-image).

### 4. Fill layer

You can place an extra color layer on top of the image.

<figure><img src="/files/8qjwAAiLZrkT5YCg29XM" alt=""><figcaption></figcaption></figure>

### 5. Add text

You can add text over the images by simply **double-clicking on the desired image**.

<figure><img src="/files/Rp8j7pPVNAUwWDNyklBm" alt=""><figcaption></figcaption></figure>
