How does it work for pagination on the backstretch slide-show?

[lantanioka]

hi!
’m thing about how add a pagination on the slide(fade slideshow ver)
if you have some of example,could you show me?

thx.

[musicjunk]

Hi,

if done it with CSS classes for the set of simple bullet pagination.
You'll need a set (same quantitiy as backstretch images) of bullets in your HTML code, each bullet(image or character) with class="pag". Put this inside document ready.

// Set active for the first bullet when document ready;;
$('.pag').first().addClass('pagact');
// Since you called it as $.backstretch, it's attached to the body
var instance = $("body").data("backstretch");
$('.pag').click(function () {
  var index = $('.pag').index( $(this) );
  $('.pag').removeClass('pagact');
  $(this).addClass('pagact');
  // Show the slide based on the clicked index
  instance.show(index);
  // Return false, so that the click doesn't change the page hash
  return false;
});
// Set the current pagination active while running as slideshow
$(window).on("backstretch.before", function (e, instance, index) {
  $('.pag').removeClass('pagact').eq(index).addClass('pagact');
  });

Maybe not the best way but it works.

[jannovy]

Or you can use just this

$('.sliderbullets').find('li').click(function (x) {
x.preventDefault();
$('#screen1').data('backstretch').show(this.value);
});