$(document).ready(function() {
  $('.slideshow').after('<div id="slidenav"><div id="slide-toggle" class="play"></div></div>').cycle({
    fx: 'fade',
    timeout: 10000,
    pause: 1, // choose your transition type, ex: fade, scrollUp, shuffle, etc...
    pager: '#slidenav'
  });

  $('#slide-toggle').click(function() {

    if ($(this).hasClass('pause')) {
      $('.slideshow').cycle('resume');
      $(this).removeClass('pause').addClass('play');
    }
    else {
      $('.slideshow').cycle('pause');
      $(this).removeClass('play').addClass('pause');
    }
  });
});