bxSlider external pager about bxslider-3

[craigmdennis]

You need to assign a variable name to the slider in order to control it.

var slider = $('#slider1').bxSlider({
    mode: 'fade',
    controls: false
});

Then you can do:

$('#slideone).click(function(event){
    event.preventDefault();
    slider.goToSlide(2);
});

The public function only accept a number.
This page should give you an idea: http://bxslider.com/examples/custom-controls-outside-slider

Also it's better to use event.preventDefault(); than return false; to prevent the link from jumping the page.

[sween]

the above bxslider example is casters up :/

[Tusko]

bxSlider init:

$('selector > ul').bxSlider({
    pagerCustom: '.nav2slider'
});

html for custom pager:

< nav class="nav2slider">
    < a href=""  data-slide-index="0">Slide 1</a>
    < a href=""  data-slide-index="1">Slide 2</a>
    < a href=""  data-slide-index="2">Slide 3</a>
    < a href=""  data-slide-index="3">Slide 4</a>
    < a href=""  data-slide-index="4">Slide 5</a>
    < a href=""  data-slide-index="5">Slide 6</a>
< /nav>