Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 I tried to add ?score=50 to the URL but that didn't work. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264100 Share on other sites More sharing options...
kenrbnsn Posted May 29, 2007 Share Posted May 29, 2007 In my code sample, change <?php $pbar_width = (isset($_GET['w']))?$_GET['w']:10; echo '<span class="pbar" style="width:' . $pbar_width . '%;"> </span>'; ?> to <?php $pbar_width = (isset($_GET['score']))?$_GET['score']:0; echo '<span class="pbar" style="width:' . $pbar_width . '%;"> </span>'; ?> Ken Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264102 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 Ok, Is there a way to add text to it? I did it before with a .gif button I used this name for the button in a CSS file: .button Then I did this on the page I used the button on: <div class=".button">title here</div> Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264104 Share on other sites More sharing options...
maxim Posted May 29, 2007 Share Posted May 29, 2007 you can use output buffering, and to it with text like using dots for example. check out hudzilla.org Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264111 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 I'd rather like to use the CSS way if that is possible. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264113 Share on other sites More sharing options...
kenrbnsn Posted May 29, 2007 Share Posted May 29, 2007 Do you want text inside, below, or above it? Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264114 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 Ok, now I got another problem, when I enter this URL of the bar between img tags it says that the image isn't accessable. PS: I want the text inside, I can change font color and stuff like that myself, I only need to know how to put it there. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264117 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 I entered the bar code between img tags here too (post above), but it shows a blank line. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264120 Share on other sites More sharing options...
per1os Posted May 29, 2007 Share Posted May 29, 2007 It shouldn't be accessible. If you want it displayed like an image you have to use the www.php.net/image image functions along with headers. The CSS is to be on the page and it will not act like an image at all other than it sorta looks like one on the page. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264124 Share on other sites More sharing options...
Lumio Posted May 29, 2007 Share Posted May 29, 2007 I made a little function: <?php function createBar ($val, $max, $width='150', $height='15', $_col_bar=array(0,128,0), $_col_bg=array(255,250,255)) { $im = imagecreatetruecolor($width, $height); $col_bar = imagecolorallocate($im, $_col_bar[0], $_col_bar[1], $_col_bar[2]); $col_bg = imagecolorallocate($im, $_col_bg[0], $_col_bg[1], $_col_bg[2]); imagefill($im, 0, 0, $col_bg); $min = $val / $max; $gr_min = $width * $min; $points = array( 0, 0, $gr_min, 0, $gr_min, $height, 0, $height); imagefilledpolygon($im, $points, 4, $col_bar); return $im; } header('Content-type: image/jpeg'); imagejpeg( createBar(200,300, 500, 20, array(255, 128, 0), array(230, 235, 255)) ); ?> Remember to only use that function without outputting anything (with echo, ...) and don't use plain-text (like html code, ...) So how does it work: createBar ($val, $max [, $width] [, $height=15] [, $_col_bar] [, $_col_bg]) $val = value (example 200) $max = maximal value (example 300) $width = width of bar in pixel (example 500) $height = height of bar in pixel (example 20) $_col_bar = color of bar (an array ... used like array (r, g, b))... so for example array(255, 128, 0) (orange)) $_col_bg = background color (the same as $_col_bar) Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264125 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 It shouldn't be accessible. If you want it displayed like an image you have to use the www.php.net/image image functions along with headers. The CSS is to be on the page and it will not act like an image at all other than it sorta looks like one on the page. Then why does this one work?: Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264139 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 Anyone? ??? Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264155 Share on other sites More sharing options...
kenrbnsn Posted May 29, 2007 Share Posted May 29, 2007 Please repost the script that is being used for the above image. Also post the script that uses the CSS code. Ken Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264156 Share on other sites More sharing options...
Lumio Posted May 29, 2007 Share Posted May 29, 2007 Anyone? ??? I gave you an example to do that with php Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264157 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 I don't have the script of the image I showed. This is my code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Progress Bar</title> <style> .bar { display: block; width: 100px; border: 1px solid #B2B2B2; height: 8px; } .pbar { display: block; background-color: #FFE83F; float: left; height: 8px; } </style> </head> <body> <div class="bar"> <?php $pbar_width = (isset($_GET['score']))?$_GET['score']:0; echo '<span class="pbar" style="width:' . $pbar_width . '%;"> </span>'; ?> <div style="clear:both;line-height:0.01em"> </div> </div> </body> </html> Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264161 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 Anyone? ??? I gave you an example to do that with php I'd rather try to use the code I have now first. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264162 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 So how can I make it work as image on fora? Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264180 Share on other sites More sharing options...
Sir Softsand Posted May 29, 2007 Author Share Posted May 29, 2007 Can anyone help me please? I'd like the bar to work as soon as possible. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264194 Share on other sites More sharing options...
Lumio Posted May 29, 2007 Share Posted May 29, 2007 how do you want to solve it... with php or css? Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264224 Share on other sites More sharing options...
MadTechie Posted May 30, 2007 Share Posted May 30, 2007 Then why does this one work?: it does work http://www.bf2stats.nl/progress.php?score=20 20 = the percentage Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264378 Share on other sites More sharing options...
Sir Softsand Posted May 30, 2007 Author Share Posted May 30, 2007 I want a bar like the green bars show above that I can use as image on fora and websites. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264739 Share on other sites More sharing options...
taith Posted May 30, 2007 Share Posted May 30, 2007 if you do it the css way... you can not only get it static by php... if you really want... you can make it move via javascript... css makes the world go round... lol Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264747 Share on other sites More sharing options...
Sir Softsand Posted May 30, 2007 Author Share Posted May 30, 2007 I used CSS and php, this is the code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Sander's Progress Bar</title> <style> .bar { display: block; width: 100px; border: 1px solid #B2B2B2; height: 8px; } .pbar { display: block; background-color: #AD0008; float: left; height: 8px; } </style> </head> <body> <div class="bar"> <?php $pbar_width = (isset($_GET['score']))?$_GET['score']:0; echo '<span class="pbar" style="width:' . $pbar_width . '%;"> </span>'; ?> <div style="clear:both;line-height:0.01em"> </div> </div> </body> </html> Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264756 Share on other sites More sharing options...
kenrbnsn Posted May 30, 2007 Share Posted May 30, 2007 That is basically the code I provided yesterday. How are you integrating it into your code? Ken Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264776 Share on other sites More sharing options...
Sir Softsand Posted May 30, 2007 Author Share Posted May 30, 2007 That is indeed the code I got from you, but it doesn't work as an image. I can't enter it on fora and websites. Link to comment https://forums.phpfreaks.com/topic/53430-solved-progress-bar/page/2/#findComment-264783 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.