Haz 02
PHP ve birazda CSS’ in yardımıyla basit fakat kullanışlı bir ilerleme çubuğu örneği.Daha fazla geliştirilebilir elbet, bu size kalmış.Anlamadığınız herhangi bir yer ile ilgili her türlü sorunuza elimden geldiğince cevap vermeye çalışırım.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>PHP - Ilerleme Cubugu</title>
<span id="more-320"></span>
<style type="text/css">
/*İlerleme çubuğumuzun çerçeve kısmı*/
.cerceve {
width: 300px; /*Genişlik*/
padding: 2px; /*İçe doğru 2px çök*/
border: 2px solid #666666; /*Kenarlık özellikleri*/
}
.ilerleme {
text-align: center; /*İçindeki metinler ortalansın*/
font-size: 15px; /*Font büyüklüğü 15px olsun*/
}
</style>
</head>
<body>
<?php
$Yuzdeler = array(23, 38, 75, 12, 47, 7, 64); // Yüzldeleri bir diziye atıyoruz
?>
<?php
foreach ($Yuzdeler as $Yuzde): // Yüzdeleri sorgulamak için teker teker alıyoruz
if ($Yuzde < 30) // Yüzde 30 dan küçük ise...
$Renk = '#99cc00';
elseif ($Yuzde > 30 and $Yuzde < 60) // Yüzde 30 dan büyük ve 60 dan küçük ise...
$Renk = '#ffcc66';
else // Yukarıdakiler değilse... (Dolayısıyla 60 dan büyük ise)
$Renk = '#cc0033';
?>
<div class="cerceve">
<div class="ilerleme" style="background-color: <?php echo $Renk; ?>; width: <?php echo $Yuzde; ?>%;">%<?php echo $Yuzde ?></div>
</div>
<br />
<?php endforeach; ?>
</body>
</html> |
Çıktısı şöyle olacaktır:
İyi çalışmalar.
