Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.02.2016, 18:12
Аспирант
Отправить личное сообщение для Artem_A Посмотреть профиль Найти все сообщения от Artem_A
 
Регистрация: 17.01.2016
Сообщений: 49

НЕ работает Анимация
не понимаю как сделать чтобы проценты тоже считались от 0 до 80
<div id="progressbar" value="80">
    <div class="progress"></div>
    <div class="progress-label"></div>
</div>

$(function(){

var progressBar = $('#progressbar').attr('value');
var progressLabel = $('.progress-label');
// проценты

//  анимация прогресса
$('.progress').animate({
  opacity: 1,
  width: progressBar + '%'
}, 30000).animate(10000, function() {
  $('#progressbar').find(progressLabel).text(progressBar + '%');
});
});

Последний раз редактировалось Artem_A, 02.02.2016 в 18:40.
Ответить с цитированием
  #2 (permalink)  
Старый 02.02.2016, 23:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,024

progressbar animate
Artem_A,


<!DOCTYPE HTML><html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    .progress{
      height: 15px;
      background-color: #FF0000;
      width: 0;
    }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script>
 $(function() {
    var progressBar = $("#progressbar"),
        val = progressBar.data("value"),
        progressLabel = $(".progress-label", progressBar);
    $(".progress").animate({
        width: val + "%"
    }, {
        step: function(a, b) {
            b.prop == "width" && progressLabel.text((a|0) + "%")
        },
        duration: 30000
    })
});
  </script>
</head>

<body>
<div id="progressbar" data-value="80">
    <div class="progress"></div>
    <div class="progress-label"></div>
</div>

</body>

</html>

Последний раз редактировалось рони, 02.02.2016 в 23:34.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jQyery функция странно работает! Midel Общие вопросы Javascript 4 08.04.2012 12:40
Из-за цикла не работает анимация Isaac Общие вопросы Javascript 28 07.08.2011 11:17
помогите найти ошибку (работает в IE но не работает в Firefox) Len4ik Javascript под браузер 2 11.05.2010 14:41
ajax запросы, работает на одних компах и не работает на других vtornik23 AJAX и COMET 2 22.03.2010 17:22
Цикличность анимация? SashaBorandi jQuery 1 25.12.2008 08:20