php tutorials webpage special effects dynamically display the progress of the server running the program
if ('source' == $ _get ['act']) {// View the source code
show_source ($ _ server ["script_filename"]);
exit
} // end if
set_time_limit (0);
for ($ i = 0; $ i <5000; $ i ++) {
$ users [] = 'tom_'. $ i;
} // end for
$ width = 500; / / display the length of the bar, in px
$ total = count ($ users); // The total number of records that need to be manipulated
$ pix = $ width / $ total; // The length of each bar's progress bar
$ progress = 0; / / the current length of the bar
?>
<html>
<head>
<title> </ title>
<meta http-equiv = "content-type" content = "text / html; charset = gb2312" />
<style>
body, div input {font-family: tahoma; font-size: 9pt}
</ style>
<script language = "webpage effects">
<! -
function updateprogress (smsg, iwidth)
{
document.getelementbyid ("status"). innerhtml = smsg;
document.getelementbyid ("progress"). style.width = iwidth + "px";
document.getelementbyid ("percent"). innerhtml = parseint (iwidth / <? php echo $ width;?> * 100) + "%";
}
// ->
</ script>
</ head>
<body>
<div style = "margin: 4px; padding: 8px; border: 1px solid gray; background: #eaeaea; width: <? php echo $ width + 8;?> px">
<div> <font color = "gray"> The following dynamic effects of the progress bar generated by the server-side php program combined with the client web page effects program. </ font> </ div>
<div style = "padding: 0; background-color: white; border: 1px solid navy; width: <? php echo $ width;?> px">
<div id = "progress" style = "padding: 0; background-color: # ffcc66; border: 0; width: 0px; text-align: center; height: 16px"> </ div>
</ div>
<div id = "status"> </ div>
<div id = "percent" style = "position: relative; top: -30px; text-align: center; font-weight: bold; font-size: 8pt"> 0% </ div>
</ div>
<? php
flush (); // Send the output to the client browser
foreach ($ users as $ user) {
// Use null loop here to simulate a more time-consuming operation that needs to be replaced in practice;
// If your operation is not time consuming, I think you no need to use this script :)
for ($ i = 0; $ i <10000; $ i ++) {
;;
}
?>
<script language = "javascript">
updateprogress ("operating user" <? php echo $ user;?> "....", <? php echo min ($ width, intval ($ progress));?>);
</ script>
<? php
flush (); // Send the output to the client browser, so that it can immediately execute the javascript program output by the server.
$ progress + = $ pix;
} // end foreach
// Finally, the progress bar is set to the maximum $ width, while displaying the operation is completed
?>
<script language = "javascript">
updateprogress ("operation completed!", <? php echo $ width;?>);
</ script>
<? php
flush ();
?>
<input type = "button" value = "View source" onclick = "document.location.href = '<? php echo $ _server [' php_self '];?>? act = source'" />
</ body>
</ html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
