Thursday, November 7, 2013

Foundation Slideshow add


Delete existing script tag at end of html document to modify

 <!--add to control orbit image slideshow settings-->
  <script>
    $(document).foundation('orbit', {

  animation: 'fade',
  timer_speed: 5000, //duration per slide; 1000 equivalent of 1 second
  timer: true,  // display timer (true or false)
  pause_on_hover: false, // automatically pause timer when hovered (set true or false)
  resume_on_mouseout: false,
  animation_speed: 500, //duration of slideshow transition; 1000 equivalent of 1 second
  stack_on_small: true,
  navigation_arrows: true, // display previous & next arrows (set true or false)
  slide_number: false, // display slide numbers (set true or false)
  bullets: false,  //display bullet navigation  (set true or false)
  container_class: 'orbit-container',
  stack_on_small: false,
stack_on_small_class: 'orbit-stack-on-small',
  next_class: 'orbit-next',
  prev_class: 'orbit-prev',
  timer_container_class: 'orbit-timer',
  timer_paused_class: 'paused',
  timer_progress_class: 'orbit-progress',
  slides_container_class: 'orbit-slides-container',
  bullets_container_class: 'orbit-bullets',
  bullets_active_class: 'active',
  slide_number_class: 'orbit-slide-number',
  caption_class: 'orbit-caption',
  active_slide_class: 'active',
  orbit_transition_class: 'orbit-transitioning',
  next_on_click: false,
  variable_height: false,
  before_slide_change: function(){},
  after_slide_change: function(){}

 
});
  </script>

No comments:

Post a Comment