---
metadata:
  - name: generator
    content: Diplodoc Platform v5.50.3
alternate:
  - https://divkit.tech/docs/en/concepts/divs/2/div-slide-transition.md
  - https://divkit.tech/docs/ru/concepts/divs/2/div-slide-transition.md
---
> **Documentation Index:** Fetch the complete configuration index at https://divkit.tech/docs/en/llms.txt

# div-slide-transition
Slide animation.

## Parameters
| Parameters | Description |
| --- | --- |
| `type` | <p>**string**</p><p>Required parameter.</p><p>The value must always be `slide`.</p><p>Available platforms: Android, iOS, web.</p> |
| `distance` | <p>**object**</p><p>A fixed value of an offset which the element starts appearing from or at which it finishes disappearing. If no value is specified, the distance to the selected edge of a parent element is used.</p><p>The value has the type `div-dimension`.</p><p>Available platforms: Android, iOS, web.</p> |
| `duration` | <p>**int**</p><p>Animation duration in milliseconds.</p><p>Restriction for the value `x`: `x >= 0`.</p><p>Default value: `200`.</p><p>Available platforms: Android, iOS, web.</p> |
| `edge` | <p>**string**</p><p>Edge of a parent element for one of the action types:<li>where the element will move from when appearing;</li><li>where the element will move to when disappearing.</li></p><p>Possible values: `left`, `top`, `right`, `bottom`.</p><p>Default value: `bottom`.</p><p>Available platforms: Android, iOS, web.</p> |
| `interpolator` | <p>**string**</p><p>Transition speed nature.</p><p>Possible values: `linear`, `ease`, `ease_in`, `ease_out`, `ease_in_out`, `spring`.</p><p>Default value: `ease_in_out`.</p><p>Available platforms: Android, iOS, web.</p> |
| `start_delay` | <p>**int**</p><p>Delay in milliseconds before animation starts.</p><p>Restriction for the value `x`: `x >= 0`.</p><p>Default value: `0`.</p><p>Available platforms: Android, iOS, web.</p> |

<details>
<summary>JSON</summary>

```json
{
  type*: "slide",
  distance: {
    unit: "string",
    value*: "number"
  },
  duration: "int",
  edge: "string",
  interpolator: "string",
  start_delay: "int"
}
```
</details>