HTML PHP Progress Bar
Progress Bar: Simple Text Version :
<?php
// Output a 'waiting message'
echo 'Please wait while this task completes';
// Now while waiting for a certain task to
// complete, keep outputting .'s
while (true) {
// Echo an extra dot, and flush the buffers
// to ensure it gets displayed.
echo ' .';
flush();
// Now sleep for 1 second and check again:
sleep(1);
}
?>
Progress Bar: PHP-Based (grphical) :
<?php
// A function that will create the initial setup
// for the progress bar: You can modify this to
// your liking for visual purposes:
function create_progress() {
// First create our basic CSS that will control
// the look of this bar:
echo "
<style>
#text {
position: absolute;
top: 100px;
left: 50%;
margin: 0px 0px 0px -150px;
font-size: 18px;
text-align: center;
width: 300px;
}
#barbox_a {
position: absolute;
top: 130px;
left: 50%;
margin: 0px 0px 0px -160px;
width: 304px;
height: 24px;
background-color: black;
}
.per {
position: absolute;
top: 130px;
font-size: 18px;
left: 50%;
margin: 1px 0px 0px 150px;
background-color: #FFFFFF;
}
.bar {
position: absolute;
top: 132px;
left: 50%;
margin: 0px 0px 0px -158px;
width: 0px;
height: 20px;
background-color: #0099FF;
}
.blank {
background-color: white;
width: 300px;
}
</style>
";
// Now output the basic, initial, XHTML that
// will be overwritten later:
echo "
<div id='text'>Script Progress</div>
<div id='barbox_a'></div>
<div class='bar blank'></div>
<div class='per'>0%</div>
";
// Ensure that this gets to the screen
// immediately:
flush();
}
// A function that you can pass a percentage as
// a whole number and it will generate the
// appropriate new div's to overlay the
// current ones:
function update_progress($percent) {
// First let's recreate the percent with
// the new one:
echo "<div class='per'>{$percent}
%</div>\n";
// Now, output a new 'bar', forcing its width
// to 3 times the percent, since we have
// defined the percent bar to be at
// 300 pixels wide.
echo "<div class='bar' style='width: ",
$percent * 3, "px'></div>\n";
// Now, again, force this to be
// immediately displayed:
flush();
}
// Ok, now to use this, first create the
// initial bar info:
create_progress();
// Now, let's simulate doing some various
// amounts of work, and updating the progress
// bar as we go. The usleep commands will
// simulate multiple lines of code
// being executed.
usleep(350000);
update_progress(7);
usleep(1550000);
update_progress(28);
usleep(1000000);
update_progress(48);
usleep(1000000);
update_progress(68);
usleep(150000);
update_progress(71);
usleep(150000);
update_progress(74);
usleep(150000);
update_progress(77);
usleep(1150000);
update_progress(100);
// Now that you are done, you could also
// choose to output whatever final text that
// you might wish to, and/or to redirect
// the user to another page.
?>
Creating a progress bar using php
Switch out these lines of code with these:
You have to set a height for the divs and then you have to decide on what colors you want the divs to be. Also, and this is my preference. When echoing out html, I usually use single quotes on the outsides of the echo and I use double quotes for the html attributes.
This should work though.
echo '<div id="progressbar" style="height:50px;background-color:yellow;">';
echo '<div id="amountcompleted" style="height:50px; width:' . $progressBarWidth . '% !important; background-color:lightblue"></div>';
echo '</div>';
I didn't see that you had your CSS posted. Here is CSS solution.. You did not declare your CSS classes in your attributes.
echo '<div id="progressbar" class="progressbar">';
echo '<div id="amountcompleted" class="amountcompleted" style="width:' . $progressBarWidth . '% !important;"></div>';
echo '</div>';
How to change the value of a Bootstrap progress bar using PHP
Try this,
$total_prize=360000;
$paid_amount=260000;
$width = round(($paid_amount/$total_prize)*100,2);
echo '<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="'.$width.'"
aria-valuemin="0" aria-valuemax="'.$total_prize.'" style="width:'.$width.'%">
'.$width.'% Complete
</div>
</div>';
HTML PHP Math : Fill a progress bar using rank values
- Replace
<?php print get_rank($rank) * next_rank($level) / 2; ?>
by<?php print_r(($rank*100)/(get_rank($rank)+$rank)); ?>
should do the job you want. - For
function level($rank)
if i inputlevel(10)
output will be10
as you are returning$rank
without any calculation.
Related Topics
How to Detect an Incoming Request (With PHP Script) from a Cname Subdomain
Is There a PHP Sandbox, Something Like Jsfiddle Is to Js
How to Integrate Nodejs + Socket.Io and PHP
Traits in PHP - Any Real World Examples/Best Practices
PHP Regex to Check Date Is in Yyyy-Mm-Dd Format
Checking If Array Is Multidimensional or Not
How to Install the Ext-Curl Extension with PHP 7
How to Easily Consume a Web Service from PHP
PHP Objects VS Arrays -- Performance Comparison While Iterating
Looping a Multidimensional Array in PHP
Array_Multisort and Dynamic Variable Options
Create Programmatically a Variable Product and Two New Attributes in Woocommerce
How to Generate Random Date Between Two Dates Using PHP
How Get Value for Unchecked Checkbox in Checkbox Elements When Form Posted