Question

i am trying to intergrate the jquery progress bar but i am getting issues.

take the follwoing code..

$(document).ready(function(){

  $( "#progressbar" ).progressbar({value: 0});

  var size = $(".item img.main").size();

  var overall = 100 / size;

   var sum = overall;
   $(".item img.main").each(function (index) {
    var $this = $(this);

    console.log(sum++);
        $( "#progressbar" ).progressbar({value: sum++});

  });

to view a better example i have put one into js bin here.

http://jsbin.com/ogatij/2/edit#source

render code and you will see what i mean the num++ is not working for me say with the 3 images.

the overall value is 33.333333333333336

ok so this should loop three time to the each loop using ++

33.333333333333336
66.333333333333336
100

but this doesnt work i get the following.

33.333333333333336
34.333333333333336
35.333333333333336

can anyone explain why this is happening???

Thanks

Answer 1

Because sum++ will just increase the value by 1. Try this.

$(document).ready(function(){

  $( "#progressbar" ).progressbar({value: 0});

  var size = $(".item img.main").size();

  var overall = 100 / size;

   var sum = overall;
   $(".item img.main").each(function (index) {
    var $this = $(this);

    console.log((overall * (index + 1)));
        $( "#progressbar" ).progressbar({value: (overall * (index + 1))});

  });