mirror of
https://github.com/hanzoai/jube-fork.git
synced 2026-11-02 14:29:36 +00:00
106 lines
4.4 KiB
HTML
Executable File
106 lines
4.4 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Basic usage</title>
|
|
<meta charset="utf-8">
|
|
<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.common.min.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.rtl.min.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.default.min.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.default.mobile.min.css" rel="stylesheet">
|
|
<script src="../../js/jquery.min.js"></script>
|
|
<script src="../../js/jszip.min.js"></script>
|
|
<script src="../../js/kendo.all.min.js"></script>
|
|
<script src="../content/shared/js/console.js"></script>
|
|
<script>
|
|
|
|
</script>
|
|
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<a class="offline-button" href="../index.html">Back</a>
|
|
|
|
<div id="example">
|
|
<div class="demo-section k-content wide">
|
|
<div id="toolbar"></div>
|
|
</div>
|
|
<script>
|
|
$(document).ready(function() {
|
|
$("#toolbar").kendoToolBar({
|
|
items: [
|
|
{ type: "button", text: "Button" },
|
|
{ type: "button", text: "Toggle Button", togglable: true },
|
|
{
|
|
type: "splitButton",
|
|
text: "Insert",
|
|
menuButtons: [
|
|
{ text: "Insert above", icon: "insert-up" },
|
|
{ text: "Insert between", icon: "insert-middle" },
|
|
{ text: "Insert below", icon: "insert-down" }
|
|
]
|
|
},
|
|
{ type: "separator" },
|
|
{ template: "<label for='dropdown'>Format:</label>" },
|
|
{
|
|
template: "<input id='dropdown' style='width: 150px;' />",
|
|
overflow: "never"
|
|
},
|
|
{ type: "separator" },
|
|
{
|
|
type: "buttonGroup",
|
|
buttons: [
|
|
{ icon: "align-left", text: "Left", togglable: true, group: "text-align" },
|
|
{ icon: "align-center", text: "Center", togglable: true, group: "text-align" },
|
|
{ icon: "align-right", text: "Right", togglable: true, group: "text-align" }
|
|
]
|
|
},
|
|
{
|
|
type: "buttonGroup",
|
|
buttons: [
|
|
{ icon: "bold", text: "Bold", togglable: true },
|
|
{ icon: "italic", text: "Italic", togglable: true },
|
|
{ icon: "underline", text: "Underline", togglable: true }
|
|
]
|
|
},
|
|
{
|
|
type: "button",
|
|
text: "Action",
|
|
overflow: "always"
|
|
},
|
|
{
|
|
type: "button",
|
|
text: "Another Action",
|
|
overflow: "always"
|
|
},
|
|
{
|
|
type: "button",
|
|
text: "Something else here",
|
|
overflow: "always"
|
|
}
|
|
]
|
|
});
|
|
|
|
$("#dropdown").kendoDropDownList({
|
|
optionLabel: "Paragraph",
|
|
dataTextField: "text",
|
|
dataValueField: "value",
|
|
dataSource: [
|
|
{ text: "Heading 1", value: 1 },
|
|
{ text: "Heading 2", value: 2 },
|
|
{ text: "Heading 3", value: 3 },
|
|
{ text: "Title", value: 4 },
|
|
{ text: "Subtitle", value: 5 }
|
|
]
|
|
});
|
|
});
|
|
</script>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</body>
|
|
</html>
|