Hvordan procent barer?

Men det er vel noget med at billedet skal deles op eller noget?
Er der nogen der har nogle idé'er?

Du kan gøre det i javascript.

Hvad med at lave en gif for begge ender.

På det lige mellemstykke kan du lave en gif med en bredde på 1 pixel.
Så skal du bare regne ud hvor mange pixels du skal strække billedet til for at få eks. 5 %

Kan du ikke lave baggrunden gul og så smide 'rammen' ovenpå som transperent. Derefter sæt 'style="width: <?php echo $value; ?>;";

Eller noget i den dur, det plejer jeg at kunne få til at virke.

Jeg plejer at lave:
$ialt = round($value);
<span style="background-color:#00C000;"><img src="/images/spacer.gif" width="<?php echo $ialt; ?>" height="8"></span>

hvor spacer.gif blot er et gifbillede på 1x1 pixels med gennemsigtig baggrund

Jeg tænkte på om man ikke kunne lave billedet, og så sætte en width på. Altså sådan den ikke viser mere end billedet hvis. billedet nu er 150, og width er 120. Så viser den bare ikke desidste 30 pixels af billedet

Det er jo egentlig let nok at lave en.. Problemet er bare at jeg vil have den grafisk :)

Jeg har lavet to billeder, et blåt og et gult, og det er begge 200px brede og 13 høje. nedenstående viser "25%"

<div style="position: relative; width: 200px; height: 13px;">
    <IMG style="position: absolute; clip: rect(0 50 13 0);" src="gul.gif">
    <IMG style="position: absolute; clip: rect(0 200 13 50);" src="blaa.gif">
</div>

De to steder der står 50 skal du altså skrive procenten gange 2 (fordi billederne er 200 brede)

Hej... Jeg har nu lavet min funktion. Med en skide masse if og elseif'er.. Jeg har hørt noget om at hvis man bruger mange af dem skulle det blive langsom, kan man lave det om til en anden funktin? En funktion der bare forhøjer værdi if value 2 og så næste 3 og igen 4, istedet for at man skal lave en elseif ved hver. Og så plusser filnavnet med en hver gang?

Forstår i hvad jeg mener?
Kan man gøre denne kode hurtigere?


<?php
$value = 20;
if($value == "0") {
print "<img border=\"0\" src=\"blue.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "1") {
print "<img border=\"0\" src=\"1.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "2") {
print "<img border=\"0\" src=\"2.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "3") {
print "<img border=\"0\" src=\"3.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "4") {
print "<img border=\"0\" src=\"4.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "5") {
print "<img border=\"0\" src=\"5.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "6") {
print "<img border=\"0\" src=\"6.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "7") {
print "<img border=\"0\" src=\"7.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "8") {
print "<img border=\"0\" src=\"8.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "9") {
print "<img border=\"0\" src=\"9.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "10") {
print "<img border=\"0\" src=\"10.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "11") {
print "<img border=\"0\" src=\"11.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "12") {
print "<img border=\"0\" src=\"12.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "13") {
print "<img border=\"0\" src=\"13.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "14") {
print "<img border=\"0\" src=\"14.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "15") {
print "<img border=\"0\" src=\"15.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "16") {
print "<img border=\"0\" src=\"16.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "17") {
print "<img border=\"0\" src=\"17.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "18") {
print "<img border=\"0\" src=\"18.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "19") {
print "<img border=\"0\" src=\"19.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "20") {
print "<img border=\"0\" src=\"20.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "21") {
print "<img border=\"0\" src=\"21.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "22") {
print "<img border=\"0\" src=\"22.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "23") {
print "<img border=\"0\" src=\"23.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "24") {
print "<img border=\"0\" src=\"24.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "25") {
print "<img border=\"0\" src=\"25.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "26") {
print "<img border=\"0\" src=\"26.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "27") {
print "<img border=\"0\" src=\"27.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "28") {
print "<img border=\"0\" src=\"28.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "29") {
print "<img border=\"0\" src=\"29.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "30") {
print "<img border=\"0\" src=\"30.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "31") {
print "<img border=\"0\" src=\"31.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "32") {
print "<img border=\"0\" src=\"32.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "33") {
print "<img border=\"0\" src=\"33.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "34") {
print "<img border=\"0\" src=\"34.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "35") {
print "<img border=\"0\" src=\"35.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "36") {
print "<img border=\"0\" src=\"36.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "37") {
print "<img border=\"0\" src=\"37.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "38") {
print "<img border=\"0\" src=\"38.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "39") {
print "<img border=\"0\" src=\"39.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "40") {
print "<img border=\"0\" src=\"40.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "41") {
print "<img border=\"0\" src=\"41.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "42") {
print "<img border=\"0\" src=\"42.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "43") {
print "<img border=\"0\" src=\"43.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "44") {
print "<img border=\"0\" src=\"44.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "45") {
print "<img border=\"0\" src=\"45.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "46") {
print "<img border=\"0\" src=\"46.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "47") {
print "<img border=\"0\" src=\"47.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "48") {
print "<img border=\"0\" src=\"48.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "49") {
print "<img border=\"0\" src=\"49.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "50") {
print "<img border=\"0\" src=\"50.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "51") {
print "<img border=\"0\" src=\"51.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "52") {
print "<img border=\"0\" src=\"52.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "53") {
print "<img border=\"0\" src=\"53.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "54") {
print "<img border=\"0\" src=\"54.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "55") {
print "<img border=\"0\" src=\"55.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "56") {
print "<img border=\"0\" src=\"56.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "57") {
print "<img border=\"0\" src=\"57.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "58") {
print "<img border=\"0\" src=\"58.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "59") {
print "<img border=\"0\" src=\"59.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "60") {
print "<img border=\"0\" src=\"60.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "61") {
print "<img border=\"0\" src=\"61.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "62") {
print "<img border=\"0\" src=\"62.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "63") {
print "<img border=\"0\" src=\"63.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "64") {
print "<img border=\"0\" src=\"64.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "65") {
print "<img border=\"0\" src=\"65.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "66") {
print "<img border=\"0\" src=\"66.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "67") {
print "<img border=\"0\" src=\"67.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "68") {
print "<img border=\"0\" src=\"68.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "69") {
print "<img border=\"0\" src=\"69.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "70") {
print "<img border=\"0\" src=\"70.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "71") {
print "<img border=\"0\" src=\"71.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "72") {
print "<img border=\"0\" src=\"72.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "73") {
print "<img border=\"0\" src=\"73.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "74") {
print "<img border=\"0\" src=\"74.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "75") {
print "<img border=\"0\" src=\"75.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "76") {
print "<img border=\"0\" src=\"76.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "77") {
print "<img border=\"0\" src=\"77.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "78") {
print "<img border=\"0\" src=\"78.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "79") {
print "<img border=\"0\" src=\"79.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "80") {
print "<img border=\"0\" src=\"82.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "81") {
print "<img border=\"0\" src=\"81.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "82") {
print "<img border=\"0\" src=\"82.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "83") {
print "<img border=\"0\" src=\"83.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "84") {
print "<img border=\"0\" src=\"84.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "85") {
print "<img border=\"0\" src=\"85.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "86") {
print "<img border=\"0\" src=\"86.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "87") {
print "<img border=\"0\" src=\"87.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "88") {
print "<img border=\"0\" src=\"88.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "89") {
print "<img border=\"0\" src=\"89.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "90") {
print "<img border=\"0\" src=\"90.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "91") {
print "<img border=\"0\" src=\"91.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "92") {
print "<img border=\"0\" src=\"92.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "93") {
print "<img border=\"0\" src=\"93.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "94") {
print "<img border=\"0\" src=\"94.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "95") {
print "<img border=\"0\" src=\"95.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "96") {
print "<img border=\"0\" src=\"96.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "97") {
print "<img border=\"0\" src=\"97.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "98") {
print "<img border=\"0\" src=\"98.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "99") {
print "<img border=\"0\" src=\"99.bmp\" width=\"200\" height=\"13\">";
}
elseif($value == "100") {
print "<img border=\"0\" src=\"100.bmp\" width=\"200\" height=\"13\">";
}
?>

Jeg er ikke så hård til php, men:

if($value == "0") {
print "<img border=\"0\" src=\"blue.bmp\" width=\"200\" height=\"13\">";
}
else{
print "<img border=\"0\" src=\"$value.bmp\" width=\"200\" height=\"13\">";
}

Øh, hvorfor kunne du ikke bruge mit sidste forslag?

print "<div style=\"position: relative; width: 200px; height: 13px;\"><IMG style=\"position: absolute; clip: rect(0 " . $value * 2 . " 50 13 0);\" src=\"gul.gif\"><IMG style=\"position: absolute; clip: rect(0 200 13 " . $value * 2 . ");\" src=\"blaa.gif\"></div>";

Har selv lavet en engang:

http://www.hangtilhygge.dk/kourinsu/procent.php

Koden er:

<table width="100" border="0" cellspacing="0" cellpadding="0">
  <tr>
<?
$procent = "50";
$i = 1;
while($i <= 100) {
if($i <= $procent) {
$bgcolor = blue;
}
else {
$bgcolor = red;
}
?>
    <td bgcolor="<?= $bgcolor; ?>" id="<?= $i; ?>">&nbsp;</td>
<?
$i++;
}
?> 
  </tr>
</table>

Skal det ikke lukkes?

Det burde det nok jo :o