Question

I am a bit of a noob when it comes to JAVA script, I can read it just about.

I have a script for a slideshow gallery with the code below. And it has nav buttons with numbers. This is all fine how ever they start at number 0 – 5 when I need them to start at 1 -6 .
I have found the code which sets this and it uses an ‘+index+’ option which I guess just counts up from 0. How do I set this to start at 1 not 0? I tried +index+1, & (+1) and a few other in line but it stops it working.
Code below…

if(pager.length) {
    pager.eq(current).addClass('active');
} else if(o.pager){
    obj.append('<ul class="bbpager"></ul>');
    slides.each(function(index) {
    $('.bbpager', obj).append('<li class="pagerButton"><a href="#">
                         <span>'+index+'</span></a></li>')
    });
    pager = $('.bbpager li', obj);
    pager.eq(current).addClass('active');
}

And I tried to add just var index = 1; also below

if ( index === null){
     index = 1 localStorage.setItem("index",index); 
}

Never worked. any idea how i can +1 to the outputted labels?

Answer 1

Wrapping the index+1 in parenthesis should get you what you want.

$('.bbpager', obj).append('<li class="pagerButton"><a href="#"><span>'+(index+1)+'</span></a></li>');

If you want, you can save that 1-based index into a variable of it’s own:

var display_index = index + 1;
$('.bbpager', obj).append('<li class="pagerButton"><a href="#"><span>'+ display_index +'</span></a></li>');

The reason the index+1 didn’t work on it’s own is because what it does is adds from left to right and converts all of the numbers into strings.

So what you’ll end up with is:

'<li class="pagerButton"><a href="#"><span>{index}1</span></a></li>'

Adding the parenthesis will force the index to be incremented by 1 before it starts constructing the combined string.