blob: 4dd818d3b6cad18902ebc508ff3b3ee139d3c05d (
plain)
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
|
/**
* syncHeight - jQuery plugin to automagically Snyc the heights of columns
* Made to seemlessly work with the CCS-Framework YAML (yaml.de)
* @requires jQuery v1.0.3
*
* http://blog.ginader.de/dev/syncheight/
*
* Copyright (c) 2007-2009
* Dirk Ginader (ginader.de)
* Dirk Jesse (yaml.de)
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* Version: 1.2
*
* Usage:
$(window).load(function(){
$('p').syncHeight();
});
*/
(function($) {
var getHeightProperty = function() {
var browser_id = 0;
var property = [
// To avoid content overflow in synchronised boxes on font scaling, we
// use 'min-height' property for modern browsers ...
['min-height','0px'],
// and 'height' property for Internet Explorer.
['height','1%']
];
// check for IE6 ...
if($.browser.msie && $.browser.version < 7){
browser_id = 1;
}
return { 'name': property[browser_id][0],
'autoheightVal': property[browser_id][1] };
};
$.getSyncedHeight = function(selector) {
var max = 0;
var heightProperty = getHeightProperty();
// get maximum element height ...
$(selector).each(function() {
// fallback to auto height before height check ...
$(this).css(heightProperty.name, heightProperty.autoheightVal);
var val = $(this).height();
if(val > max){
max = val;
}
});
return max;
};
$.fn.syncHeight = function(config) {
var defaults = {
updateOnResize: false, // re-sync element heights after a browser resize event (useful in flexible layouts)
height: false
};
var options = $.extend(defaults, config);
var e = this;
var max = 0;
var heightPropertyName = getHeightProperty().name;
if(typeof(options.height) === "number") {
max = options.height;
} else {
max = $.getSyncedHeight(this);
}
// set synchronized element height ...
$(this).each(function() {
$(this).css(heightPropertyName, max+'px');
});
// optional sync refresh on resize event ...
if (options.updateOnResize === true) {
$(window).resize(function(){
$(e).syncHeight();
});
}
return this;
};
})(jQuery);
|
