js/foundation/foundation.orbit.js in zurb-foundation-4.3.1 vs js/foundation/foundation.orbit.js in zurb-foundation-4.3.2
- old
+ new
@@ -32,18 +32,24 @@
bullets_container.children().removeClass(settings.bullets_active_class);
$(bullets_container.children().get(index)).addClass(settings.bullets_active_class);
}
};
+ self.update_active_link = function(index) {
+ var link = $('a[data-orbit-link="'+slides_container.children().eq(index).attr('data-orbit-slide')+'"]');
+ link.parents('ul').find('[data-orbit-link]').removeClass(settings.bullets_active_class);
+ link.addClass(settings.bullets_active_class);
+ };
+
self.build_markup = function() {
slides_container.wrap('<div class="'+settings.container_class+'"></div>');
container = slides_container.parent();
slides_container.addClass(settings.slides_container_class);
if (settings.navigation_arrows) {
- container.append($('<a>').addClass(settings.prev_class).append('<span>'));
- container.append($('<a>').addClass(settings.next_class).append('<span>'));
+ container.append($('<a href="#"><span></span></a>').addClass(settings.prev_class));
+ container.append($('<a href="#"><span></span></a>').addClass(settings.next_class));
}
if (settings.timer) {
timer_container = $('<div>').addClass(settings.timer_container_class);
timer_container.append('<span>');
@@ -52,11 +58,11 @@
container.append(timer_container);
}
if (settings.slide_number) {
number_container = $('<div>').addClass(settings.slide_number_class);
- number_container.append('<span></span> of <span></span>');
+ number_container.append('<span></span> ' + settings.slide_number_text + ' <span></span>');
container.append(number_container);
}
if (settings.bullets) {
bullets_container = $('<ol>').addClass(settings.bullets_container_class);
@@ -70,10 +76,11 @@
if (settings.stack_on_small) {
container.addClass(settings.stack_on_small_class);
}
self.update_slide_number(0);
+ self.update_active_link(0);
};
self._goto = function(next_idx, start_timer) {
// if (locked) {return false;}
if (next_idx === idx) {return false;}
@@ -88,25 +95,27 @@
var current = $(slides.get(idx));
var next = $(slides.get(next_idx));
current.css('zIndex', 2);
- next.css('zIndex', 4).addClass('active');
+ current.removeClass(settings.active_slide_class);
+ next.css('zIndex', 4).addClass(settings.active_slide_class);
slides_container.trigger('orbit:before-slide-change');
settings.before_slide_change();
+ self.update_active_link(next_idx);
var callback = function() {
var unlock = function() {
idx = next_idx;
locked = false;
if (start_timer === true) {timer = self.create_timer(); timer.start();}
self.update_slide_number(idx);
slides_container.trigger('orbit:after-slide-change',[{slide_number: idx, total_slides: slides.length}]);
settings.after_slide_change(idx, slides.length);
};
- if (slides_container.height() != next.height()) {
+ if (slides_container.height() != next.height() && settings.variable_height) {
slides_container.animate({'height': next.height()}, 250, 'linear', unlock);
} else {
unlock();
}
};
@@ -116,11 +125,11 @@
var start_animation = function() {
if (dir === 'next') {animate.next(current, next, callback);}
if (dir === 'prev') {animate.prev(current, next, callback);}
};
- if (next.height() > slides_container.height()) {
+ if (next.height() > slides_container.height() && settings.variable_height) {
slides_container.animate({'height': next.height()}, 250, 'linear', start_animation);
} else {
start_animation();
}
};
@@ -147,11 +156,11 @@
};
self.link_bullet = function(e) {
var index = $(this).attr('data-orbit-slide');
if ((typeof index === 'string') && (index = $.trim(index)) != "") {
- self._goto(index);
+ self._goto(parseInt(index));
}
}
self.timer_callback = function() {
self._goto(idx + 1, true);
@@ -193,55 +202,57 @@
};
self.init = function() {
self.build_markup();
if (settings.timer) {timer = self.create_timer(); timer.start();}
- animate = new FadeAnimation(slides_container);
+ animate = new FadeAnimation(settings, slides_container);
if (settings.animation === 'slide')
- animate = new SlideAnimation(slides_container);
+ animate = new SlideAnimation(settings, slides_container);
container.on('click', '.'+settings.next_class, self.next);
container.on('click', '.'+settings.prev_class, self.prev);
container.on('click', '[data-orbit-slide]', self.link_bullet);
container.on('click', self.toggle_timer);
- container.on('touchstart.fndtn.orbit', function(e) {
- if (!e.touches) {e = e.originalEvent;}
- var data = {
- start_page_x: e.touches[0].pageX,
- start_page_y: e.touches[0].pageY,
- start_time: (new Date()).getTime(),
- delta_x: 0,
- is_scrolling: undefined
- };
- container.data('swipe-transition', data);
- e.stopPropagation();
- })
- .on('touchmove.fndtn.orbit', function(e) {
- if (!e.touches) { e = e.originalEvent; }
- // Ignore pinch/zoom events
- if(e.touches.length > 1 || e.scale && e.scale !== 1) return;
+ if (settings.swipe) {
+ container.on('touchstart.fndtn.orbit', function(e) {
+ if (!e.touches) {e = e.originalEvent;}
+ var data = {
+ start_page_x: e.touches[0].pageX,
+ start_page_y: e.touches[0].pageY,
+ start_time: (new Date()).getTime(),
+ delta_x: 0,
+ is_scrolling: undefined
+ };
+ container.data('swipe-transition', data);
+ e.stopPropagation();
+ })
+ .on('touchmove.fndtn.orbit', function(e) {
+ if (!e.touches) { e = e.originalEvent; }
+ // Ignore pinch/zoom events
+ if(e.touches.length > 1 || e.scale && e.scale !== 1) return;
- var data = container.data('swipe-transition');
- if (typeof data === 'undefined') {data = {};}
+ var data = container.data('swipe-transition');
+ if (typeof data === 'undefined') {data = {};}
- data.delta_x = e.touches[0].pageX - data.start_page_x;
+ data.delta_x = e.touches[0].pageX - data.start_page_x;
- if ( typeof data.is_scrolling === 'undefined') {
- data.is_scrolling = !!( data.is_scrolling || Math.abs(data.delta_x) < Math.abs(e.touches[0].pageY - data.start_page_y) );
- }
+ if ( typeof data.is_scrolling === 'undefined') {
+ data.is_scrolling = !!( data.is_scrolling || Math.abs(data.delta_x) < Math.abs(e.touches[0].pageY - data.start_page_y) );
+ }
- if (!data.is_scrolling && !data.active) {
- e.preventDefault();
- var direction = (data.delta_x < 0) ? (idx+1) : (idx-1);
- data.active = true;
- self._goto(direction);
- }
- })
- .on('touchend.fndtn.orbit', function(e) {
- container.data('swipe-transition', {});
- e.stopPropagation();
- })
- .on('mouseenter.fndtn.orbit', function(e) {
+ if (!data.is_scrolling && !data.active) {
+ e.preventDefault();
+ var direction = (data.delta_x < 0) ? (idx+1) : (idx-1);
+ data.active = true;
+ self._goto(direction);
+ }
+ })
+ .on('touchend.fndtn.orbit', function(e) {
+ container.data('swipe-transition', {});
+ e.stopPropagation();
+ })
+ }
+ container.on('mouseenter.fndtn.orbit', function(e) {
if (settings.timer && settings.pause_on_hover) {
self.stop_timer();
}
})
.on('mouseleave.fndtn.orbit', function(e) {
@@ -251,10 +262,13 @@
});
$(document).on('click', '[data-orbit-link]', self.link_custom);
$(window).on('resize', self.compute_dimensions);
$(window).on('load', self.compute_dimensions);
+ $(window).on('load', function(){
+ container.prev('.preloader').css('display', 'none');
+ });
slides_container.trigger('orbit:ready');
};
self.init();
};
@@ -305,46 +319,50 @@
self.update_progress(w);
el.trigger('orbit:timer-stopped');
};
};
- var SlideAnimation = function(container) {
- var duration = 400;
+ var SlideAnimation = function(settings, container) {
+ var duration = settings.animation_speed;
var is_rtl = ($('html[dir=rtl]').length === 1);
var margin = is_rtl ? 'marginRight' : 'marginLeft';
+ var animMargin = {};
+ animMargin[margin] = '0%';
this.next = function(current, next, callback) {
- next.animate({margin: '0%'}, duration, 'linear', function() {
+ next.animate(animMargin, duration, 'linear', function() {
current.css(margin, '100%');
callback();
});
};
this.prev = function(current, prev, callback) {
prev.css(margin, '-100%');
- prev.animate({margin:'0%'}, duration, 'linear', function() {
+ prev.animate(animMargin, duration, 'linear', function() {
current.css(margin, '100%');
callback();
});
};
};
- var FadeAnimation = function(container) {
- var duration = 250;
+ var FadeAnimation = function(settings, container) {
+ var duration = settings.animation_speed;
+ var is_rtl = ($('html[dir=rtl]').length === 1);
+ var margin = is_rtl ? 'marginRight' : 'marginLeft';
this.next = function(current, next, callback) {
- next.css({'marginLeft':'0%', 'opacity':'0.01'});
+ next.css({'margin':'0%', 'opacity':'0.01'});
next.animate({'opacity':'1'}, duration, 'linear', function() {
- current.css('marginLeft', '100%');
+ current.css('margin', '100%');
callback();
});
};
this.prev = function(current, prev, callback) {
- prev.css({'marginLeft':'0%', 'opacity':'0.01'});
+ prev.css({'margin':'0%', 'opacity':'0.01'});
prev.animate({'opacity':'1'}, duration, 'linear', function() {
- current.css('marginLeft', '100%');
+ current.css('margin', '100%');
callback();
});
};
};
@@ -352,21 +370,22 @@
Foundation.libs = Foundation.libs || {};
Foundation.libs.orbit = {
name: 'orbit',
- version: '4.3.1',
+ version: '4.3.2',
settings: {
animation: 'slide',
timer_speed: 10000,
pause_on_hover: true,
resume_on_mouseout: false,
animation_speed: 500,
stack_on_small: false,
navigation_arrows: true,
slide_number: true,
+ slide_number_text: 'of',
container_class: 'orbit-container',
stack_on_small_class: 'orbit-stack-on-small',
next_class: 'orbit-next',
prev_class: 'orbit-prev',
timer_container_class: 'orbit-timer',
@@ -380,9 +399,10 @@
active_slide_class: 'active',
orbit_transition_class: 'orbit-transitioning',
bullets: true,
timer: true,
variable_height: false,
+ swipe: true,
before_slide_change: noop,
after_slide_change: noop
},
init: function (scope, method, options) {