Usage

$(function() {
  var Slide = $('#slide').switchable({
    putTriggers: 'appendTo',
    panels: 'li',
    initIndex: -1, // display the last panel
    effect: 'scrollRight', // taking effect when autoplay == true
    easing: 'cubic-bezier(.455, .03, .515, .955)', // equal to 'easeInOutQuad'
    end2end: true, // if set to true, loop == true
    loop: false, // not taking effect, because end2end == true
    autoplay: true,
    interval: 5,
    api: true // if set to true, Switchable returns API
  }).pause();

  var btn = $('#j-button');
  btn.click(function(e){
    e.preventDefault();

    if ( Slide.paused ) {
      Slide.play();
      btn.text('Pause');
    }
    else {
      Slide.pause();
      btn.text('Play');
    }
  });
});

/* Required Styles */
#slide {
  position: relative;
  width: 550px;
  height: 310px;
  overflow: hidden;
}
#slide li {
  float: left;
}