mirror of
https://github.com/hanzoai/jube-fork.git
synced 2026-11-02 14:29:36 +00:00
174 lines
7.0 KiB
HTML
Executable File
174 lines
7.0 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Inline editing</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 wide k-content">
|
|
<div id="topEditor">
|
|
<h2>
|
|
Comprehensive HTML5/JavaScript framework <br />
|
|
for modern web and mobile app development
|
|
</h2>
|
|
<p>
|
|
Kendo UI is everything professional developers need
|
|
to build HTML5 sites and mobile apps. Today, productivity
|
|
of an average HTML/jQuery developer is hampered by
|
|
assembling a Frankenstein framework of disparate
|
|
JavaScript libraries and plug-ins.
|
|
</p>
|
|
<p>
|
|
Kendo UI has it all: rich jQuery-based widgets,
|
|
a simple and consistent programming interface,
|
|
a rock-solid DataSource, validation, internationalization,
|
|
a MVVM framework, themes, templates and the list goes on.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<img src="../content/web/editor/web.png" />
|
|
<h3>Web app <br />development framework</h3>
|
|
<p>
|
|
Kendo UI Web provides you with a simple and consistent
|
|
programming interface, polished and innovative
|
|
UI widgets for the web, powered by jQuery, HTML5 & CSS3,
|
|
a MVVM framework, themes which are easily customizable to
|
|
fit the widgets to your web application, templates
|
|
and much more. All that's left to do is to develop modern
|
|
desktop and mobile web applications by leveraging your web
|
|
development skills while unlocking the power of JavaScript,
|
|
HTML5 & CSS3, and using the intuitive <br />
|
|
<a href="https://www.telerik.com/kendo-ui-web" title="Kendo UI Web">Kendo UI Web</a>.
|
|
</p>
|
|
</div>
|
|
<div class="column">
|
|
<img src="../content/web/editor/mobile.png" />
|
|
<h3>Mobile app <br />development framework</h3>
|
|
<p>
|
|
Build native-like mobile apps for iPhone, Android and Blackberry,
|
|
and deliver unmatched user experience without any extra coding.
|
|
</p>
|
|
<p>
|
|
<a href="https://www.telerik.com/kendo-ui-mobile" title="Kendo UI Mobile">Kendo UI Mobile</a>
|
|
is packed with easy-to-use jQuery-based widgets and built-in
|
|
rich components for your fast mobile application development.
|
|
</p>
|
|
</div>
|
|
<div class="column">
|
|
<img src="../content/web/editor/dataviz.png" />
|
|
<h3>Rich UI widgets for interactive <br />data visualization </h3>
|
|
<p>
|
|
Create interactive data visualization with HTML5 and JavaScript,
|
|
build rich web apps that look and behave native on any platform or device.
|
|
Kendo UI DataViz uses SVG, and brings you a collection of UI widgets,
|
|
including jQuery charts, gauges, and more.
|
|
</p>
|
|
<p>
|
|
<a href="https://www.telerik.com/kendo-ui-dataviz" title="Kendo UI DataViz">Kendo UI DataViz</a>
|
|
uses automatic hardware acceleration for all animations and rendering,
|
|
maximizing performance and minimizing the impact on CPU resources.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.k-editor-inline {
|
|
margin: 0;
|
|
padding: 20px 20px 10px;
|
|
box-shadow: none;
|
|
background: none;
|
|
}
|
|
|
|
#topEditor h2, .column h3 {
|
|
font-size: 24px;
|
|
color: #2db245;
|
|
font-family: "Droid Sans",DroidSansWeb,"Segoe UI","Lucida Sans Unicode",Arial,Helvetica,sans-serif;
|
|
}
|
|
|
|
.k-editor-inline p {
|
|
font-size: 13px;
|
|
}
|
|
|
|
.column {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
max-width: 250px;
|
|
}
|
|
|
|
.column a {
|
|
color: #e15613;
|
|
}
|
|
|
|
.column h3 {
|
|
padding-top: 10px;
|
|
font-size: 15px;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
$("#topEditor").kendoEditor({
|
|
tools: [
|
|
"bold",
|
|
"italic",
|
|
"underline",
|
|
"strikethrough",
|
|
"justifyLeft",
|
|
"justifyCenter",
|
|
"justifyRight",
|
|
"justifyFull",
|
|
"createLink",
|
|
"unlink",
|
|
"insertImage",
|
|
"createTable",
|
|
"addColumnLeft",
|
|
"addColumnRight",
|
|
"addRowAbove",
|
|
"addRowBelow",
|
|
"deleteRow",
|
|
"deleteColumn",
|
|
"foreColor",
|
|
"backColor"
|
|
]
|
|
});
|
|
|
|
$(".column").kendoEditor({
|
|
tools: [
|
|
"bold",
|
|
"italic",
|
|
"underline",
|
|
"createLink",
|
|
"unlink",
|
|
"insertImage"
|
|
]
|
|
});
|
|
});
|
|
</script>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</body>
|
|
</html>
|