jQuery Responsive Progress Bar

Add-ons

2026-07-26 01:11 4 次浏览 • 0 次下载 3.6KB

Plugin Description: jQuery responsive progress bar flexible.js. Automatically adjusts the responsive layout based on screen size, using 100px = 1rem.

Last Updated: 2020-06-07 21:44:11

Usage

Progress Bar Integration

<link rel="stylesheet" href="./css/base.css">
<link rel="stylesheet" href="./css/index.css">
<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/index.js"> </script>
<script src="js/schedule.js"> </script>

html

<!-- Progress Bar -->
<div class="schedule_box">
    <div id="scheduleX"></div>
</div>    

Call the corresponding progress bar function.

scheduleX({
    fulfill: 50, // Progress bar, starting number
    listAll: 100, // Total value
    speed: 25, // Animation speed, optional, default: 25. The smaller the value, the faster the animation.
    again: false, // Whether the animation starts from zero when the selected value changes. Default: true (starts from zero).
    bgColor: "#7a7a7a", // Bottom color
    listColor: "#fdcf12", // Expandable bar color
    scWidth: "1.6", //Progress bar width
    scHeight: "0.08", // Progress bar height
    WateringTree: WateringTrees // Click
});