$(document).ready(function(){
  $(function(){
    $('#productSlider')
      //.before('<ol id="productSliderNav">')
      .cycle({
        fx:      'scrollHorz',
        timeout: 0,
        prev:    '#previousProduct',
        next:    '#nextProduct',
        after:   onAfter
        /*
        pager:   '#productSliderNav',
        // callback fn that creates a thumbnail to use as pager anchor
        pagerAnchorBuilder: function(idx, slide) {
          return '<li><a href="#">' + slide.id+ '</a></li>';
        }
        */
      });
      function onAfter(currSlideElement, nextSlideElement, options, forwardFlag) {
        $('#tipSliderNav li:eq('+options.currSlide+') a').trigger('click'); 
        return false;
      }
  });
  
  $(function(){
    $('#tipSlider')
      .before('<ol id="tipSliderNav" style="visibility:hidden;">')
      .cycle({
        fx:      'scrollHorz',
        timeout: 0,
        prev:    '#previousTip',
        next:    '#nextTip',
        pager:   '#tipSliderNav',
        // callback fn that creates a thumbnail to use as pager anchor
        pagerAnchorBuilder: function(idx, slide) {
          return '<li><a href="#">' + slide.id+ '</a></li>';
        }

      });
  });
   $.scrollTo('#munat', 3000 );
});

/* $(obj).cycle.fx can be any of the following 
 * see http://jquery.malsup.com/cycle/browser.html
 * blindX
 * blindY
 * blindZ
 * cover
 * curtainX
 * curtainY
 * fade
 * fadeZoom
 * growX
 * growY
 * none
 * scrollUp
 * scrollDown
 * scrollLeft
 * scrollRight
 * scrollHorz
 * scrollVert
 * shuffle
 * slideX
 * slideY
 * toss
 * turnUp
 * turnDown
 * turnLeft
 * turnRight
 * uncover
 * wipe
 * zoom
 */