Dotted pagination for jquery.destaque

dotted_pagination_jquery_destaque.js

var destaque = $("#slide-container").destaque({
  itemSelector: ".item",
  itemBackgroundSelector: ".background",
  itemForegroundElementSelector: ".foreground .element",
  controlsSelector: "#slide-pagination a",
  onPageUpdate: function(destaque, pageData) {
    $(".indicator .bullet").removeClass("active");
    $(".indicator .bullet[rel='"+ pageData.currentSlide +"']").addClass("active");
  }
});

$(".indicator .bullet").click(function(e) {
  e.preventDefault();
  destaque.goTo(parseInt($(this).attr("rel"), 10));
});

dotted_pagination_markup_jquery_destaque.html

<div class="indicator">
  <a href="#" class="bullet active" rel="0">1</a>
  <a href="#" class="bullet" rel="1">2</a>
  <a href="#" class="bullet" rel="2">3</a>
  <a href="#" class="bullet" rel="3">4</a>
  <a href="#" class="bullet" rel="4">5</a>
  <a href="#" class="bullet" rel="5">6</a>
  <a href="#" class="bullet" rel="6">7</a>
  <a href="#" class="bullet" rel="7">8</a>
  <a href="#" class="bullet" rel="8">9</a>
  <a href="#" class="bullet" rel="9">10</a>
</div>