cvaraprasad Posted October 26, 2012 Share Posted October 26, 2012 <html> <head> <style type="text/css"> /*#pwidget { background-color:lightgray; width:254px; padding:2px; -moz-border-radius:3px; border-radius:3px; text-align:left; border:1px solid gray; }*/ #progressbar { width:30px; padding:1px; background-color:white; border:1px solid black; height:10px; } #indicator { width:0px; background-image:url("shaded-green.png"); height:10px; margin:0; } /*#progressnum { text-align:center; width:250px; }*/ </style> <script type="text/javascript"> function disp_text() { var w = document.myform.mylist.selectedIndex; //alert(w); var selected_text = document.myform.mylist.options[w].value; return selected_text; } function disp_text1() { var x = document.myform1.mylist1.selectedIndex; //alert(x); var second_selected_text = document.myform1.mylist1.selectedIndex; //alert(second_selected_text); return second_selected_text; } var maxprogress = 30 ; // total to reach var actualprogress = 0; // current value var itv = 0; // id to setinterval function prog() { var val = disp_text(); var temp = val; val = maxprogress; maxprogress = temp; if(actualprogress >= maxprogress) { clearInterval(itv); return; } var progressnum = document.getElementById("progressnum"); var indicator = document.getElementById("indicator"); actualprogress += 1; indicator.style.width=actualprogress + "px"; progressnum.innerHTML = actualprogress; if(actualprogress == maxprogress) clearInterval(itv); } </script> </head> <body> <table width="100%"> <tr> <td width="117"><div id="progressbar"> <div id="indicator"></div> </div></td> <td width="78"><div id="pwidget"> <div id="progressnum">0</div> </div></td> <td width="288"> <FORM NAME="myform"> <SELECT NAME="mylist" onchange="disp_text()" class="foo"> <OPTION VALUE="">Select</OPTION> <OPTION VALUE="30">Raghu</OPTION> <OPTION VALUE="45">Vara</OPTION> <OPTION VALUE="60">Sashi</OPTION> </SELECT> </FORM></td></tr><tr> <td width="117"><div id="progressbar"> <div id="indicator"></div> </div></td> <td width="78"><div id="pwidget"> <div id="progressnum">0</div> </div></td><td> <FORM NAME="myform1"> <SELECT NAME="mylist1" onchange="disp_text1()" class="foo"> <OPTION VALUE="">Select</OPTION> <OPTION VALUE="30">Raghu</OPTION> <OPTION VALUE="45">Vara</OPTION> <OPTION VALUE="60">Sashi</OPTION> </SELECT> </FORM> <input type="button" name="Submit" value="Start the progression" onclick="itv = setInterval(prog, 70)" /> </td> <td width="520"> <input type="button" name="Submit2" value="Stop" onclick="clearInterval(itv)" /></td> </tr> <tr> <td> </td> </tr> </table> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/269932-please-help-me-out-with-working-of-two-progress-bars-at-a-time/ Share on other sites More sharing options...
Beeeeney Posted October 26, 2012 Share Posted October 26, 2012 Really? Quote Link to comment https://forums.phpfreaks.com/topic/269932-please-help-me-out-with-working-of-two-progress-bars-at-a-time/#findComment-1387874 Share on other sites More sharing options...
MDCode Posted October 26, 2012 Share Posted October 26, 2012 No organization, no errors, no description, no tags. Fix those issues, then I may help Quote Link to comment https://forums.phpfreaks.com/topic/269932-please-help-me-out-with-working-of-two-progress-bars-at-a-time/#findComment-1387890 Share on other sites More sharing options...
Christian F. Posted October 26, 2012 Share Posted October 26, 2012 Read this. Quote Link to comment https://forums.phpfreaks.com/topic/269932-please-help-me-out-with-working-of-two-progress-bars-at-a-time/#findComment-1387894 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.