Demos

Demonstrate some use cases we are supporting.

Note that on desktop, you might have to add the enableMouseEvents prop, in order for the demos to work properly.

Simple

A Simple case.

slide n°1

Tabs

With a header.

slide n°1

Scroll

Set a constant height and let the swipe and scroll behavior work in harmony.

item n°1

item n°2

item n°3

item n°4

item n°5

item n°6

item n°7

item n°8

item n°9

item n°10

item n°11

item n°12

item n°13

item n°14

item n°15

item n°16

item n°17

item n°18

item n°19

item n°20

item n°21

item n°22

item n°23

item n°24

item n°25

item n°26

item n°27

item n°28

item n°29

item n°30

Animate height

The container responds dynamically to its children.

item n°1

item n°2

item n°3

item n°4

item n°5

item n°6

item n°7

item n°8

item n°9

item n°10

Resistance

With a resistance bounds effet on the edges.

slide n°1

Nested

With nested swipeable-view component.

This is component is very large so we can test how a native scroll container is handled.

slide n°1

nested slide n°1.1

Auto play

With the auto play HOC.

slide n°1

Virtualize

With the virtualize HOC.

slide n°1

Axis

Swipe up and down.

slide n°1

Keyboard

With a keyboard binding.

slide n°1

Hocs

With all the HOCs.

slide n°1

Custom width

Custom width of slides.

slide n°1

Rtl

Right-to-left direction

slide n°1

Circular

The 3 slides are repeated indefinitely.

slide n°1

Coverflow

Custom display with a coverflow effect.

Abbey Road