div-page-transformation-slide

The pages are moving when the pager is flipping without overlaping each other.

Parameters

Parameters Description
type

string

Required parameter.

The value must always be slide.
interpolator

string

Tranformation speed nature. When the value is set to spring — animation of damping fluctuations cut to 0.7 with the damping=1 parameter. Other options correspond to the Bezier curve:

  • linear — cubic-bezier(0, 0, 1, 1);
  • ease — cubic-bezier(0.25, 0.1, 0.25, 1);
  • ease_in — cubic-bezier(0.42, 0, 1, 1);
  • ease_out — cubic-bezier(0, 0, 0.58, 1);
  • ease_in_out — cubic-bezier(0.42, 0, 0.58, 1).

    • Possible values: linear, ease, ease_in, ease_out, ease_in_out, spring.

    Default value: ease_in_out.
    next_page_alpha

    number

    Minimum alpha of the next page during pager scrolling in bounds [0, 1]. The next page is always a page with a large sequential number in the list of items, regardless of the direction of scrolling.

    Restriction for the value x: x >= 0.0 && x <= 1.0.

    Default value: 1.0.
    next_page_scale

    number

    Scale of the next page during pager scrolling. The next page is always a page with a large sequential number in the list of items, regardless of the direction of scrolling.

    Restriction for the value x: x >= 0.0.

    Default value: 1.0.
    previous_page_alpha

    number

    Minimum alpha of the previous page during pager scrolling in bounds [0, 1]. The previous page is always a page with a lower sequential number in the list of items, regardless of the direction of scrolling.

    Restriction for the value x: x >= 0.0 && x <= 1.0.

    Default value: 1.0.
    previous_page_scale

    number

    Scale of the previous page during pager scrolling. The previous page is always a page with a lower sequential number in the list of items, regardless of the direction of scrolling.

    Restriction for the value x: x >= 0.0.

    Default value: 1.0.
    JSON 
    {
  type*: "slide",
  interpolator: "string",
  next_page_alpha: "number",
  next_page_scale: "number",
  previous_page_alpha: "number",
  previous_page_scale: "number"
}