Databases
StackOverflow2013
Postsdbo
POIterate over an array of divs
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POIterate over an array of divs
    text
    copied!<p>I've had to resort to this bodge to set height of div01-05 different to div11-15 :(</p> <pre><code>var maxheight = divheight; var dayofweek = &lt;?echo date("w",strtotime($today));?&gt;; var heightoffset = (2 - dayofweek) * 40; var days = jQuery('div.day01, div.day02, div.day03, div.day04, div.day05'); for (i=0; i&lt;days.length; i++){ var hh = jQuery(days[i]).prop("scrollHeight"); if (hh &gt; maxheight) { maxheight = hh; }; jQuery(days[i]).height(divheight+heightoffset); }; var days = jQuery('div.day11, div.day12, div.day13, div.day14, div.day15'); for (i=0; i&lt;days.length; i++){ var hh = jQuery(days[i]).prop("scrollHeight"); if (hh &gt; maxheight) { maxheight = hh; }; jQuery(days[i]).height(divheight-heightoffset); }; //Back to full array for further processing var days = jQuery('div.day01, div.day02, div.day03, div.day04, div.day05, div.day11, div.day12, div.day13, div.day14, div.day15'); </code></pre> <p>Would someone please put me out of my misery and show me how to just iterate over all the divs and do a conditional set height.</p> <p>One caveat is that PHP is greating the divs and div.day01 -04 might not exists depending on day of the week div.day05 always does and so do divs day11-15</p> <p>regards Simon</p> <p>Final code result(having corrected to using ids instead of classes :) </p> <pre><code> jQuery('div[id^="day"]').each(function() { var hh = jQuery(this).prop("scrollHeight"); if (hh &gt; maxheight) {maxheight = hh;}; var cn = jQuery(this).attr('id').split(" ")[0]; // Since PHP is creating these classes, we can safely assume "day" will always be the first. var num = parseInt(cn.slice(-2),10); // extract the last two characters and convert to an integer if (num &gt;=1 &amp;&amp; num &lt;= 5) { jQuery(this).height(divheight+heightoffset); }else if(num &gt;=10 &amp;&amp; num &lt;= 15){ jQuery(this).height(divheight-heightoffset); } }); </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload