New to Kendo UI for jQuery? Start a free 30-day trial

Messages

configuration

Specifies the localizable messages of the FloatingToolBar.

messages

Object
<div id="toolbar"></div>
<script>
$("#toolbar").kendoFloatingToolBar({
  visible: true,
  draggable: true,
  messages: {
    dragHandle: "Drag to move the toolbar"
  },
  items: [
    { type: "button", text: "Button" }
  ]
});
</script>

Specifies the text used as the aria-label of the drag handle, rendered when draggable is set to true.

Default: "Drag to reposition"

<div id="toolbar"></div>
<script>
$("#toolbar").kendoFloatingToolBar({
  visible: true,
  draggable: true,
  messages: {
    dragHandle: "Move toolbar"
  },
  items: [
    { type: "button", text: "Button" }
  ]
});
</script>

Specifies the text announced through the live region when the FloatingToolBar is moved down with the keyboard, while draggable is set to true.

Default: "Moved down"

<div id="toolbar"></div>
<script>
$("#toolbar").kendoFloatingToolBar({
  visible: true,
  draggable: true,
  messages: {
    movedDown: "Toolbar moved down"
  },
  items: [
    { type: "button", text: "Button" }
  ]
});
</script>

Specifies the text announced through the live region when the FloatingToolBar is moved left with the keyboard, while draggable is set to true.

Default: "Moved left"

<div id="toolbar"></div>
<script>
$("#toolbar").kendoFloatingToolBar({
  visible: true,
  draggable: true,
  messages: {
    movedLeft: "Toolbar moved left"
  },
  items: [
    { type: "button", text: "Button" }
  ]
});
</script>

Specifies the text announced through the live region when the FloatingToolBar is moved right with the keyboard, while draggable is set to true.

Default: "Moved right"

<div id="toolbar"></div>
<script>
$("#toolbar").kendoFloatingToolBar({
  visible: true,
  draggable: true,
  messages: {
    movedRight: "Toolbar moved right"
  },
  items: [
    { type: "button", text: "Button" }
  ]
});
</script>

Specifies the text announced through the live region when the FloatingToolBar is moved up with the keyboard, while draggable is set to true.

Default: "Moved up"

<div id="toolbar"></div>
<script>
$("#toolbar").kendoFloatingToolBar({
  visible: true,
  draggable: true,
  messages: {
    movedUp: "Toolbar moved up"
  },
  items: [
    { type: "button", text: "Button" }
  ]
});
</script>