HTML5 ile birlikte gelen <progress> etiketi, bir işlemin yüzdesini göstermek için kullanılır. Bu etiketi kullanarak ilerlemeyi göstermek istediğiniz bir işlemi, yüzde cinsinden görsel olarak gösterebilirsiniz.
Örneğin, bir yüklenme işlemi sırasında ilerlemenin yüzdesini göstermek için aşağıdaki kodu kullanabilirsiniz:
<progress value="50" max="100"></progress>
Bu kod, yüzde 50 ilerleme gösterir. “value” özelliği, ilerleme çubuğunun mevcut değerini belirtir. “max” özelliği, ilerleme çubuğunun maksimum değerini belirtir.
Ayrıca, <progress> etiketine “id” özelliği ekleyebilirsiniz, böylece JavaScript kodu tarafından erişilebilir hale getirebilirsiniz:
python
<progress id="myProgress" value="25" max="100"></progress>
JavaScript kodu kullanarak, ilerleme çubuğunun değerini değiştirebilirsiniz:
javascript
var progressBar = document.getElementById("myProgress");
progressBar.value = 50;
Bu kod, ilerleme çubuğunun değerini yüzde 50’ye ayarlar.
Bu uygulamada herhangi bir sorun yaşarsanız aşağıya yorum olarak bırakabilirsiniz. Bunun yanı sıra web sitemizdeki diğer hazır Html programlama örneklerine ulaşmak için bu linke tıklayabilirsiniz.