Bootstrap Animasyonlu Progress Bar

Bootstrap ile sabit kalan progress bar yerine aniamasyonlu olarak verdiğiniz değere otomatik yüklenen progress bar yapımını anlatacağım.

Mevcut sitenizde bootstrap.css olduğunu varsayıyorum yoksa burada ne işiniz var değil mi ?

Öncelikle progress bar html kodumuz aşağıda ki gibi olacak :

id=”DIVID” kısmını kendinize göre düzenlersiniz.  Verilen değere animasyonlu bir şekilde yüklenen progress barın ikinci kısmı olan js kısmı için aşağıda ki kodu kullanabilirsiniz :

width:100% olan kısım progress barın ne kadarlık kısmının yükleneceğini gösteriyor. 2500 de 2,5 saniye içerisinde olacağını söylüyor.

Leave a Reply

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir