Показ Progress Bar с jquery

Question

Мне трудно заставить индикатор выполнения отображаться при загрузке страницы.В этой таблице есть список имен и точек.Есть две кнопки «плюс» и «минус», которые изменяют количество баллов за каждое имя.Индикатор выполнения будет связан с точками.Поэтому каждый раз, когда пользователь нажимает «минус» или «плюс», индикатор выполнения будет меняться.

      <tr id = {{ item.name }}>

            <td class = "name" >{{ item.name  }}</td>
            <td class = "points">{{ item.points }}</td>
            <td><button type="button" name="" value="" id = "minus" class="buttonminus">-</button></td>
            <td><button type="button" name="" value="" id = "plus" class="buttonplus">+</button></td>
            <td><div class = "bar_panel"><div id = {{ item.name }} class = "progressbar"></div></td></div>
      </tr>

Я использовал следующее, чтобы изменить индикатор выполнения, когда пользователь нажимает «плюс» или «минус».

function vote(kind, name){
$.getJSON("/vote/", {pk: name, vote: kind },

function(json){

   ($(".points").filter('.hovered')).html(json);
   progress(json, name)

 });
 }

Есть ли способ отобразить индикатор выполнения, когда страница загружена без использования JSON?

Answer 1

Плагин QueryLoader может быть полезен.Проверьте образец здесь .

Что QueryLoader2 делает, просто сканирует указанные элементы для изображений (и фоновых изображений) и предварительно загружает их до того, как сайт станет видимым.Эта версия была изменена, чтобы упростить ее внедрение для пользователей (особенно для тех, кто уже работает с jQuery.) В настоящее время QueryLoader работает с jQuery v1.7.1 и в версии IE> 7, Chrome, Safari и Firefox.