forked from malsup/cycle2
-
Notifications
You must be signed in to change notification settings - Fork 0
/
jquery.cycle2.autoheight.js
131 lines (108 loc) · 4.03 KB
/
jquery.cycle2.autoheight.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
/*! Cycle2 autoheight plugin; Copyright (c) M.Alsup, 2012; version: 20130913 */
(function($) {
"use strict";
$.extend($.fn.cycle.defaults, {
autoHeight: 0, // setting this option to false disables autoHeight logic
autoHeightSpeed: 250,
autoHeightEasing: null
});
$(document).on( 'cycle-initialized', function( e, opts ) {
var autoHeight = opts.autoHeight;
var t = $.type( autoHeight );
var resizeThrottle = null;
var ratio;
if ( t !== 'string' && t !== 'number' )
return;
// bind events
opts.container.on( 'cycle-slide-added cycle-slide-removed', initAutoHeight );
opts.container.on( 'cycle-destroyed', onDestroy );
if ( autoHeight == 'container' ) {
opts.container.on( 'cycle-before', onBefore );
}
else if ( t === 'string' && /\d+\:\d+/.test( autoHeight ) ) {
// use ratio
ratio = autoHeight.match(/(\d+)\:(\d+)/);
ratio = ratio[1] / ratio[2];
opts._autoHeightRatio = ratio;
}
// if autoHeight is a number then we don't need to recalculate the sentinel
// index on resize
if ( t !== 'number' ) {
// bind unique resize handler per slideshow (so it can be 'off-ed' in onDestroy)
opts._autoHeightOnResize = function () {
clearTimeout( resizeThrottle );
resizeThrottle = setTimeout( onResize, 50 );
};
$(window).on( 'resize orientationchange', opts._autoHeightOnResize );
}
setTimeout( onResize, 30 );
function onResize() {
initAutoHeight( e, opts );
}
});
function initAutoHeight( e, opts ) {
var clone, height, sentinelIndex;
var autoHeight = opts.autoHeight;
if ( autoHeight == 'container' ) {
height = $( opts.slides[ opts.currSlide ] ).outerHeight();
opts.container.height( height );
}
else if ( opts._autoHeightRatio ) {
opts.container.height( opts.container.width() / opts._autoHeightRatio );
}
else if ( autoHeight === 'calc' || ( $.type( autoHeight ) == 'number' && autoHeight >= 0 ) ) {
if ( autoHeight === 'calc' )
sentinelIndex = calcSentinelIndex( e, opts );
else if ( autoHeight >= opts.slides.length )
sentinelIndex = 0;
else
sentinelIndex = autoHeight;
// only recreate sentinel if index is different
if ( sentinelIndex == opts._sentinelIndex )
return;
opts._sentinelIndex = sentinelIndex;
if ( opts._sentinel )
opts._sentinel.remove();
// clone existing slide as sentinel
clone = $( opts.slides[ sentinelIndex ].cloneNode(true) );
// #50; remove special attributes from cloned content
clone.removeAttr( 'id name rel' ).find( '[id],[name],[rel]' ).removeAttr( 'id name rel' );
clone.css({
position: 'static',
visibility: 'hidden',
display: 'block'
}).prependTo( opts.container ).addClass('cycle-sentinel cycle-slide').removeClass('cycle-slide-active');
clone.find( '*' ).css( 'visibility', 'hidden' );
opts._sentinel = clone;
}
}
function calcSentinelIndex( e, opts ) {
var index = 0, max = -1;
// calculate tallest slide index
opts.slides.each(function(i) {
var h = $(this).height();
if ( h > max ) {
max = h;
index = i;
}
});
return index;
}
function onBefore( e, opts, outgoing, incoming, forward ) {
var h = $(incoming).outerHeight();
opts.container.animate( { height: h }, opts.autoHeightSpeed, opts.autoHeightEasing );
}
function onDestroy( e, opts ) {
if ( opts._autoHeightOnResize ) {
$(window).off( 'resize orientationchange', opts._autoHeightOnResize );
opts._autoHeightOnResize = null;
}
opts.container.off( 'cycle-slide-added cycle-slide-removed', initAutoHeight );
opts.container.off( 'cycle-destroyed', onDestroy );
opts.container.off( 'cycle-before', onBefore );
if ( opts._sentinel ) {
opts._sentinel.remove();
opts._sentinel = null;
}
}
})(jQuery);