Waaah sudah lama g ketik2 disini, sudah 3 bulan ternyata...Mumpung lagi senggang dan ada banyak waktu, nah sekarang mau melanjutkan artikel sebelumnya tentang polling sederhana, kali ini saya akan menampilkan hasil polling dengan menggunakan CSS untuk tampilan hasil polling berupa "bar berwarna" agar terlihat lebih menarik. Langsung aja ke TKP...

<?
$pengali=3; //untuk mengatur panjang bar
$total_jelek=26;
$total_sedang=40;
$total_bagus=44;
//saya asumsikan angka2 diatas berasal dari data di database; silahkan query sendiri untuk mendapatkan datanya.

$total_semua=$total_jelek+$total_sedang+$total_bagus;

//dalam persen
$persen_jelek=($total_jelek/$total_semua)*100;
$persen_sedang=($total_sedang/$total_semua)*100;
$persen_bagus=($total_bagus/$total_semua)*100;

?>
<table width="418" border="0" cellpadding="0" cellspacing="1">
<tr>
<td width="62">Jelek</td>
<td><div style="font:10px tahoma; border:0px; text-align:center; background-color:#FFFF00; width:<?=$pengali*$total_jelek?>; height:20px;"><? printf("%.2f",$persen_jelek);? >%</div></td>
</tr>
<tr>
<td>Sedang</td>
<td><div style="font:10px tahoma; border:0px; background-color:#FF9900; text-align:center; width:<?=$pengali*$total_sedang?>; height:20px;"><? printf("%.2f",$persen_sedang);? >%</div></td>
</tr>
<tr>
<td>Bagus</td>
<td><div style="font:10px tahoma; border:0px; background-color:#FF0000; text-align:center; width:<?=$pengali*$total_bagus?>; height:20px;"><? printf("%.2f",$persen_bagus);? >%</div></td>
</tr>
</table>

Silahkan diubah style untuk CSSnya sesuai selera Anda

note : fungsi printf("%.2f",$persen_jelek); adalah untuk mendapatkan desimal dengan 2 angka dibelakang koma,

Komentar Pembaca (0 komentar)
		Previous - Next