Custom javascript for equil height flip cards changes cornerstone preview

[eyedia]

Hi there.

i followed this thread to get my flip cards to be equil height:

Classic Cards / Flip Cards Same Height

Here is my code:
(function($){
$(window).bind(‘ready load resize’, function(){
var max = 0,
mobile = $(window).width();
if ( mobile > 767 ){
$(".staff-section .x-card-inner").each(function(index, el) {
if( $(this).height() > max ){
max = $(this).height();
}
});
$(".staff-section .x-card-inner").css(‘min-height’, max);
}
});
})(jQuery);

@media (min-width: 768) and (max-width: 979px) {
.staff-section .x-face-content {
padding: 0 !important;
}
}

Attached is my login info so you can see. The effect is on this page: https://hybridpharm.com/about/
but it does seam to cause the same loss in formatting in cornerstone on all pages.

Any ideas?

[Alaa]

Hi @reform

I’ve updated the code on your website to be like:

function card_fix_height () {

  var max = 0,
      mobile = jQuery(window).width();
  if ( mobile > 767 ){
    jQuery(".staff-section .x-card-inner").each(function(index, el) {
      if( jQuery(this).height() > max ){
          max = jQuery(this).height();
      }
    });
    jQuery(".staff-section .x-card-inner").css('min-height', max);
  }

}

jQuery(window).resize( card_fix_height ).load( card_fix_height );
jQuery(document).ready ( card_fix_height );

And I can see it’s working fine now.
Thanks.

[eyedia]

Brilliant! Thank you so much Amazing support as always!