🎉 Material UI v4 is out now! Check out the announcement blog post →
Zoom

Zoom API

The API documentation of the Zoom React component. Learn more about the properties and the CSS customization points.

import Zoom from '@material-ui/core/Zoom';

The Zoom transition can be used for the floating variant of the Button component. It uses react-transition-group internally.

Props

Name Type Default Description
children union: element |
 func
A single child content element.
in bool If true, the component will transition in.
timeout union: number |
 { enter?: number, exit?: number }
{ enter: duration.enteringScreen, exit: duration.leavingScreen,} The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object.

Any other properties supplied will be spread to the root element (Transition).

Inheritance

The properties of the Transition component, from react-transition-group, are also available. You can take advantage of this behavior to target nested components.

Demos