Bootstrap Progressbar / Улучшение / Плагины Bootstrap | BootstrapТема

1
2
3
4
5

Версия: v0.9.0

Каталог: Плагины Bootstrap

Категория: Улучшение

Bootstrap: 3

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop, Shopify

Язык: Английский

Вес файла: 497.5 Kb

Уникальный ID: 1379

Посмотрели: 1497 раз

Скачать бесплатно

Помощь: установка & настройка

Скачали бесплатно: 27 раз

Прокомментировали: 0 раз

Рейтинг: 5.0 / 5 - 2 голосов

Тип лицензии: CC BY 4.0

Авторство: https://github.com/minddust/bootstrap-progressbar

Информация: Пользователям

Информация: Правообладателям

Теги: Plugin, Bootstrap, progressbar, индикатор, прогрессбар

Поделился: BootstrapТема

Добавлено: 2016-11-20 в 16:54

Метка: 1588866880

⇄ ⇅

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://bootstraptema.ru/plugins/2016/bp/bootstrap-progressbar-3.3.4.min.css" />
<script src="https://bootstraptema.ru/plugins/jquery/jquery-1.11.3.min.js"></script>
<script src="https://bootstraptema.ru/plugins/2016/bp/bootstrap-progressbar.min.js"></script>

<div class="container">
<div class="row">
<h1 class="text-center">Bootstrap Progressbar</h1>
<hr />
<div class="col-md-8 col-md-offset-2">

<div class="progress progress-striped active">
 <div class="progress-bar progress-bar-striped" role="progressbar" data-transitiongoal="20"></div>
</div>
<div class="progress progress-striped active">
 <div class="progress-bar progress-bar-success" role="progressbar" data-transitiongoal="40"></div>
</div>
<div class="progress progress-striped active">
 <div class="progress-bar progress-bar-info" role="progressbar" data-transitiongoal="60"></div>
</div>
<div class="progress progress-striped active">
 <div class="progress-bar progress-bar-warning" role="progressbar" data-transitiongoal="80"></div>
</div>
<div class="progress progress-striped active">
 <div class="progress-bar progress-bar-danger" role="progressbar" data-transitiongoal="100"></div>
</div>

<script>
$(document).ready(function() {
 $('.progress .progress-bar').progressbar({transition_delay: 3000});
});
</script>
 
</div>

</div>
</div>