рдмрд╣реБ-рд╕реНрддрдВрдн рдкреГрд╖реНрда рд╕рдВрд░рдЪрдирд╛

рдмрд╣реБрдд рдмрд╛рд░ рдРрд╕реА рдкрд░рд┐рд╕реНрдерд┐рддрд┐рдпрд╛рдВ рд╣реЛрддреА рд╣реИрдВ рдЬрдм рд╕рд╛рдЗрдЯ рдореЗрдВ рдХрдИ рдХреЙрд▓рдо рд╣реЛрддреЗ рд╣реИрдВ, рдФрд░ рдХрд╛рд░реНрдп рдпрд╣ рд╣реИ рдХрд┐ рд╡реЗ рдПрдХ рдХреЗ рдмрд╛рдж рдПрдХ "рдЦрд┐рдВрдЪрд╛рд╡" рдХрд░рддреЗ рд╣реИрдВ, рдЕрд░реНрдерд╛рддред рдПрдХ рд╣реА рдКрдВрдЪрд╛рдИ рд╣реИред рд╕рд░рд▓ рд╕реАрдПрд╕рдПрд╕ рдЯреВрд▓ рджреНрд╡рд╛рд░рд╛ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рд╣рд▓ рдХрд░рдирд╛ рд╣рдореЗрд╢рд╛ рд╕рдВрднрд╡ рдирд╣реАрдВ рд╣реЛрддрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП, рдореИрдВ рдПрдХ рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХрд╛ рдкреНрд░рд╕реНрддрд╛рд╡ рдХрд░рддрд╛ рд╣реВрдВ рдЬреЛ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рд╣рд▓ рдХрд░рддреА рд╣реИред



рд╕рдмрд╕реЗ рдкрд╣рд▓реЗ, рдореИрдВ рд╕рдордЭрд╛рдКрдВрдЧрд╛ рдХрд┐ рдпрд╣ рдХреИрд╕реЗ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ:



рд╕реНрдерд╛рдкрдирд╛ рдмрд╣реБрдд рд╕рд░рд▓ рд╣реИ (рд╣рдо рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХреЛ рдХрдиреЗрдХреНрдЯ рдХрд░рддреЗ рд╣реИрдВ рдФрд░ рдмреЙрдбреА рдХреЛ рдкрдВрдЬреАрдХреГрдд рдХрд░рддреЗ рд╣реИрдВред рдСрдирд▓реЛрдб рдЗрд╡реЗрдВрдЯ рд╣реИрдВрдбрд▓рд░):







class="maxheight" , , .. , :



Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Lorem ipsum dolor sit amet











2 , , .



: Sokol



(maxheight.js):

var ElementMaxHeight = function() {

this.initialize.apply(this, arguments);

}



ElementMaxHeight.prototype = {

initialize: function(className) {

this.elements = document.getElementsByClassName(className || 'maxheight');



this.textElement = document.createElement('span');

this.textElement.appendChild(document.createTextNode('A'));

this.textElement.style.display = 'none';

this.textElement.style.position = 'absolute';

this.textElement.style.fontSize = '1em';

document.body.appendChild(this.textElement);

this.textElementHeight = document.getDimensions(this.textElement).height;

var __object = this;

var __method = this.checkFontSize;

this.checkFontSizeInterval = window.setInterval(function() {return __method.apply(__object)}, 500);



this.expand();

// Refresh elements height onResize event

var __method = this.expand;

if (window.addEventListener) {

window.addEventListener('resize', function(event) {return __method.apply(__object, [( event || window.event)])}, false);

} else if (window.attachEvent) {

window.attachEvent('onresize', function(event) {return __method.apply(__object, [( event || window.event)])});

}

},



expand: function() {

this.reset();

for (var i = 0; i < this.elements.length; i++) {

this.elements[i].style.height = document.getDimensions(this.elements[i].parentNode).height + 'px';

}

},



reset: function() {

for (var i = 0; i < this.elements.length; i++) {

this.elements[i].style.height = 'auto';

}

},



checkFontSize: function() {

var height = document.getDimensions(this.textElement);

if(this.textElementHeight != height) {

this.textElementHeight = height;

this.expand();

}

}

}



if (!!document.evaluate) {

document._getElementsByXPath = function(expression, parentElement) {

var results = [];

var query = document.evaluate(expression, parentElement || document,

null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);

for (var i = 0, length = query.snapshotLength; i < length; i++)

results.push(query.snapshotItem(i));

return results;

}

}



document.getElementsByClassName = function(className, parentElement) {

if (!!document.evaluate) {

var q = ".//*[contains(concat(' ', @class, ' '), ' " + className + " ')]";

return document._getElementsByXPath(q, parentElement);

} else {

var children = (parentElement || document.body).getElementsByTagName('*');

var elements = [], child;

for (var i = 0, length = children.length; i < length; i++) {

child = children[i];

if (child.className.length != 0 &&

(child.className == className ||

child.className.match(new RegExp("(^|\\s)" + className + "(\\s|$)")))) {

elements.push(child);

}

}

return elements;

}

}



document.getDimensions = function (element) {

var display = element.style.display;

if (display != 'none' && display != null) { // Safari bug

return {width: element.offsetWidth, height: element.offsetHeight};

} else {

return {width: element.clientWidth, height: element.clientHeight};

}

}












All Articles