hii guys i have web site need to generate random progress like this

messageImage_1650466235444.jpg

can some one suggest me how can i make it

Recommended Answers

All 3 Replies

Those progress bars can easily be created with Twitter Bootstrap.

https://getbootstrap.com/docs/5.1/components/progress/

Scroll down on that page to where it says "Striped" and that should be what you're looking for.

The simplest way would be to include Bootstrap as so, in the HTML head:

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

and then, where you want the progress bar to appear, something like:

<div class="progress">
  <div class="progress-bar progress-bar-striped bg-info" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>

oke, but i mean how can i generate the value of progess random each 2 hours
like in the images in progress 1 32% and progres 2 91% and progress 3 84% and etc..

In PHP, you can generate a random number with the rand() function. So to generate a random number between 1 and 100, you would do something such as:

<?php

$number = rand(1, 100);

?>

Then you can have the progress bar to that random number as so:

<div class="progress">
  <div class="progress-bar progress-bar-striped bg-info" role="progressbar" style="width: <?= $number ?>%" aria-valuenow="<?= $number ?>" aria-valuemin="0" aria-valuemax="100"></div>
</div>

Notice the two places in the HTML code where I am spitting out the value of $number.

Note this HTML code assumes that PHP short tags are allowed in your web server. Otherwise, you would need to do something such as:

<div class="progress">
  <div class="progress-bar progress-bar-striped bg-info" role="progressbar" style="width: <?php echo $number ?>%" aria-valuenow="<?php echo $number ?>" aria-valuemin="0" aria-valuemax="100"></div>
</div>
commented: thanks +0
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.