За последние 24 часа нас посетили 22749 программистов и 1046 роботов. Сейчас ищут 752 программиста ...

Прогресс бар в зависимости от количества div при скроллинге

Тема в разделе "JavaScript и AJAX", создана пользователем JonyFront, 19 май 2019.

  1. JonyFront

    JonyFront Активный пользователь

    С нами с:
    5 июн 2016
    Сообщения:
    143
    Симпатии:
    1
    Здравствуйте! Пытаюсь сделать прогресс бар, который добавляет анимацию svg заполнение круга, % заполнение начинается на 219(начало страницы), и должно менятся при скроллинге в зависимости от количества div с классом, который подгружаються на ajax так же при скроллинге, и остановился на том, что не могу додуматься как в алгоритме все это просчитать...Прошу помощи, сам код:

    Код (Javascript):
    1.  $(window).scroll(function() {
    2.     var count_item = $('.item').length;
    3.     var height_scroll = $(this).scrollTop();
    4.     var footer_offset = $('.scroller-status').offset().top;
    5.     var s = $(window).scrollTop();
    6.     var f = $(document).height()-$(window).height();
    7.     var animate_offset = Math.round(s/f*219);
    8.  
    9.     if ($(this).scrollTop() > 0) {
    10.          $('#scrollprog').find('.circle-prog').animate({'stroke-dashoffset': animate_offset}, 10);
    11.     }
    12. });
    Сейчас он считает от 0, до 219(когда дошел до конца страницы), но не учитывает количество count_item , а оно будет меняется т.к. на ajax div подгружаються, и считает наоборот, мне же нужно начать от 219, и закончить 0. Если изначально на странице 5 div.item, то начитает с 219 числа в анимации, и когда доймем скроллом до 5-го элемента, то уже будет значение 0, но после может сработать ajax(код уже готовый есть, его писать не нужно), и подгрузит еще к примеру 5 элементов новых, в итоге 10, и уже в прогресс баре тут же сменится с 0, до 109(половина появилась), и т.д.., как это все просчитать в алгоритме? подскажите пожалуйста, заранее спасибо!
     
  2. JonyFront

    JonyFront Активный пользователь

    С нами с:
    5 июн 2016
    Сообщения:
    143
    Симпатии:
    1
    В общем решил оставить как сейчас сделал, но не могу понять как сделать, чтобы отчет был в обратном порядке, то бишь не с 0 до 219(при скроллинге, а наоборот, с 219 до 0, и как сделать чтобы высоту вычисляло не целой страницы, а до определенного div.(где будет уже 0), 219 - начало страницы, помогите пожалуйста