# FloatingActionButton Speed Dial

The FloatingActionButton can display a speed dial, which is a stack of related actions that opens when users click the button. Set the [`items`](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/api/floatingactionbuttonprops#items) property to provide the actions.

The following demo shows a speed dial with custom-rendered contact items.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/buttons/floatingactionbutton/items/custom/custom-rendering/source.txt)

## Animation

The speed dial opens its item list in a popup. By default, the popup animates when the speed dial opens and closes. To disable the animation, set the [`animate`](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/api/floatingactionbuttonpopupsettings#animate) field of the [`popupSettings`](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/api/floatingactionbuttonprops#popupSettings) property to `false`.

To control the animation speed, set `animate` to an object and specify `openDuration` and `closeDuration` in milliseconds.

The following demo lets you toggle the popup animation and adjust the open and close durations.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/buttons/floatingactionbutton/speed-dial/animation/source.txt)

## Suggested Links

* [FloatingActionButton Data Binding](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/floatingactionbutton/data-binding)
* [FloatingActionButton Customization](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/floatingactionbutton/customization)
* [FloatingActionButton Events](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/floatingactionbutton/events)
* [API Reference of the FloatingActionButtonProps](https://www.telerik.com/kendo-vue-ui-develop/components/buttons/api/floatingactionbuttonprops)
