Getting Started with the Loader
This guide demonstrates how to get up and running with the Kendo UI for jQuery Loader.
After the completion of this guide, you will be able to achieve the following end result:
<span id="loader"></span>
<script>
$('#loader').kendoLoader({
size: "large",
type: 'infinite-spinner'
});
</script>
1. Create a Span Element
Create an empty <span> element on the page and use it as an initialization element for the Loader.
<span id="loader"></span>
2. Initialize the Loader
In this step, you will initialize the Loader from the <span> element. All settings of the Loader will be provided in the initialization script statement and you have to describe its layout and configuration in JavaScript.
<span id="loader"></span>
<script>
$("#loader").kendoLoader();
</script>
3. Set the Size
The Loader provides a size option that allows you to change its dimensions:
<span id="loader"></span>
<script>
$("#loader").kendoLoader({
size: "large"
});
</script>
4. Set the Loader Type
The component has a type option which allows you to change the Loader icon:
<span id="loader"></span>
<script>
$('#loader').kendoLoader({
size: "large",
type: 'infinite-spinner'
});
</script>