phew, that was a long title. But it took me a while to figure out too. basically, I was working on creating a grid with list elements having the same height. I had done this before on Save22’s older version, and had made a function for it:
function same_height(container) { var items_height = []; $(container).each(function() { items_height.push($(this).outerHeight()); }); var tallest_content = Math.max.apply( null, items_height ); $(container).each(function(){ var item_height = $(this).parent().height(); $(this).css('height', tallest_content); }); } same_height('ul#cat-list li');
I’m using Foundation 4 for this project, and I initially put the grid behind a hidden Section tab.
The jQuery code wasn’t working. For hours I couldn’t figure out why, until Mark asked the right question: “is it initially hidden?” and pointed me to a fix someone had made:
https://coderwall.com/p/r855xw
Although I think it means I have to integrate the jQuery with the Section JS of Foundation if I want to keep it hidden, or code my own tabbed fix for this. It just meant: it wasn’t fast enough for me to implement via just the framework + my own code, as I had originally thought. But because I learned of the actual problem later in the day, I already created a different design compromise wherein I made the grid visible already, instead of being hidden.
I’ll see if I have time to make a real fix for this, since there are other pages/components I think I need to finish first.
Leave a Reply