Use the code below. Will need to change tag/selector according to theme
(function($){ if (window.innerWidth > 400) { equalheight = function(container){ var currentTallest = 0, currentRowStart = 0, rowDivs = new Array(), $el, topPosition = 0; $(container).each(function() { $el = $(this); $($el).height('auto') topPostion = $el.position().top; if (currentRowStart != topPostion) { for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) { rowDivs[currentDiv].height(currentTallest); } rowDivs.length = 0; // empty the array currentRowStart = topPostion; currentTallest = $el.height(); rowDivs.push($el); } else { rowDivs.push($el); currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest); } for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) { rowDivs[currentDiv].height(currentTallest); } }); } $(window).load(function() { equalheight('.woocommerce ul.products li .product-block-inner, .woocommerce-page ul.products li .product-block-inner'); }); $(window).resize(function(){ equalheight('.woocommerce ul.products li .product-block-inner, .woocommerce-page ul.products li .product-block-inner'); }); } })(jQuery);
Recent Comments