---
title: Keyboard Navigation
page_title: Keyboard Navigation - Splitter - Kendo UI for Vue
description: "Explore the keyboard navigation options provided by the Kendo UI Splitter wrapper for Vue."
slug: keyboard_navigation_splitter_wrapper
canonicalLink: "https://www.telerik.com/kendo-vue-ui/components/layout/splitter/keyboard-navigation/"
position: 2
---

<div><WrapperBanner link="/kendo-vue-ui/components/layout/splitter/keyboard-navigation"></WrapperBanner></div>    

# Keyboard Navigation

The keyboard navigation of the Splitter is always available.

To focus the Splitter, click in the example area and press the `Tab` key.

The Splitter supports the following keyboard shortcuts:

| SHORTCUT      | DESCRIPTION |
|:---           |:--- |
| `Up Arrow`    | Moves the focused split-bar up (in a vertical Splitter).|
| `Down Arrow`  | Moves the focused split-bar down (in a vertical Splitter).|
| `Left Arrow`  | Moves the focused split-bar to the left (in a horizontal Splitter).|
| `Right Arrow` | Moves the focused split-bar to the right (in a horizontal Splitter).|
| `Ctrl`+`Up Arrow`     | Collapses the lower pane or expands the upper one.|
| `Ctrl`+`Down Arrow`   | Collapses the upper pane or expands the lower one.|
| `Ctrl`+`Left Arrow`   | Collapses the left pane or expands the right one.|
| `Ctrl`+`Right Arrow`  | Collapses the right pane or expands the left one.|
| `Enter`       | Accepts the current position of the split-bar.|
| `Esc`         | Returns the split-bar to its initial position.|

{% meta height:380 %}
{% embed_file splitter/keyboard/main.vue preview %}
{% embed_file splitter/keyboard/main.js %}
{% endmeta %}


## Suggested Links

* [Kendo UI Splitter for jQuery](https://docs.telerik.com/kendo-ui/controls/layout/splitter/overview)
* [API Reference of the Splitter](https://docs.telerik.com/kendo-ui/api/javascript/ui/splitter)