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> 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? 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 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. 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
Archived
This topic is now archived and is closed to further replies.