Improved Product/Category div height

  • Posts: 16
  • Thank you received: 2
  • Hikashop Business
8 years 1 week ago #271418

-- HikaShop version -- : 3.1.1

When using the data-consistencyheight option to ensure that all Product/Category divs all had the same height I noticed that there was excess white space added below content.
Modifying setConsistencyHeight so that padding is take into account appears to fix this issue.

setConsistencyHeight: function(elems, mode) {
	if(!elems || !elems.length || elems.length == 0)
		return;
	var maxHeight = 0, cpt = 0;
	for(var i = elems.length - 1; i >= 0; i--) {
		var styles = window.getComputedStyle(elems[i]);
  		var padding = 	parseFloat(styles.paddingTop) +
               			parseFloat(styles.paddingBottom);
								
		if(maxHeight > 0 && elems[i].clientHeight - padding < maxHeight) {
			cpt++;
		} else if(elems[i].clientHeight - padding > maxHeight) {
			maxHeight = elems[i].clientHeight - padding;
			console.log(elems[i]);
			cpt++;
		}
	}
	if(cpt <= 1)
		return;
	for(var i = elems.length - 1; i >= 0; i--) {
		if(mode !== undefined && mode == 'min')
			elems[i].style.minHeight = maxHeight + 'px';
		else
			elems[i].style.height = maxHeight + 'px';
	}

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 26253
  • Thank you received: 4040
  • MODERATOR
8 years 1 week ago #271429

Hello,

Thanks for the share.
I'd prefer to get directly the element height without the padding.
Like what is mentioned in that stackoverflow thread: stackoverflow.com/questions/25197184/get...margin-border-widths 

var elemHeight = 0, w = window;

try {
	elemHeight  = w.getComputedStyle(elems[i]).getPropertyValue('height');
} catch(e) {
	elemHeight  = elems[i].currentStyle.height;
}
getComputedStyle is available for IE9 and newer, so the "catch" is only useful for older IE
see: developer.mozilla.org/en-US/docs/Web/API...dow/getComputedStyle

Regards,

Jerome - Obsidev.com
HikaMarket & HikaSerial developer / HikaShop core dev team.

Also helping the HikaShop support team when having some time or couldn't sleep.
By the way, do not send me private message, use the "contact us" form instead.

Please Log in or Create an account to join the conversation.

Time to create page: 0.046 seconds
Powered by Kunena Forum