<div id="slider">
      <div class="slides">
          <div class="slide-wrapper">
              <div class="slide">
                <p>Slide 1</p>
              </div>
          </div>
          <div class="slide-wrapper">
              <div class="slide">
                <p>Slide 2</p>
              </div>
          </div>
          <div class="slide-wrapper">
              <div class="slide">
                <p>Slide 3</p>
              </div>
          </div>
          <div class="slide-wrapper">
              <div class="slide">
                <p>Slide 4</p>
              </div>
          </div>
      </div>
  </div>

var slider = $("#slider").slider();

var slider = $("#slider").slider({
  afterAnimation: function(slider) {
    var currentSlide = slider.currentSlide();
    var totalSlides = slider.totalSlides();
    
    // do something with the current slide
  }
});

  beforeAnimation       Function to be called before slides start animation
  afterAnimation        Function be called after slides finish animation
  init                  Function to be called during slider initialization
  showpagination        Boolean to hide or show slide indicators
  paginationType        String declaring type of pagination to display
                        numbers  - Will display numbers, 1 of 12
                        ellipsis - Will display circlular dots
                        scrollbar - Will display a scrollbar
  ellipsisDisplay       String declaring how to display ellipsis pagination indicators
                        default  - Will display one dot per slide
                        fixed - Will display 3 dots, left indicating first slide, right
                        indicating last slide, center indicating all others in between
  scrollWithBarOnly     Boolean to restrict scroll bar movement only when the scrollbar
                        is being moved (this does not restrict slide movement by sliding)
  scrollBarFade         Boolean that will fade out the scrollbar when not in use