In this tutorial, we will learn JQuery UI Progressbar Example

The progressbar (options) method specifies that an HTML element can be managed in the form of a progress bar.

Example :

<!doctype html>
<html lang="en">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>jQuery UI Progressbar</title>
    <link rel="stylesheet" href="">
    <script src=""></script>
    <script src=""></script>
    <style type="text/css">
            background-color: #008A8B;
            width: 50%;
            margin: 30px auto;
    <h1 align="center">JQuery UI Progressbar -</h1>
    <div id="progressbar"></div>
        $( function() {
            $( "#progressbar" ).progressbar({
                value: 40


May this example help you.