Kendo UI for jQuery Loader Overview

The Loader component is a visual indicator that expresses an indeterminate wait time. It informs users about the status of ongoing processes, such as loading an application, submitting a form, saving updates or fetching data.

Kendo UI for jQuery Kendoka image

The Loader is part of Kendo UI for jQuery, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Initializing the Loader

To initialize the Loader, you can use virtually any span element. The following example demonstrates how to initialize the Loader.

    <div class="loader">
      <span id="loader"></span>
    </div>
    <script>
      $(document).ready(function(){
        $("#loader").kendoLoader();
      });
    </script>
    <style>
      .loader {
        display: flex;
        justify-content: center;
        align-items: center;
        height:450px;
      }
    </style>

Basic Configuration

The following example demonstrates the Loader in action.

    <div class="loader">
      <span id="loader"></span>
    </div>
    <script>
        $(document).ready(function(){
            $("#loader").kendoLoader({
                themeColor: "secondary",
                type:'pulsing',
                size:'medium'
            });
        });
    </script>
    <style>
      .loader {
        display: flex;
        justify-content: center;
        align-items: center;
        height:450px;
      }
    </style>

Functionality and Features

See Also

In this article