Databases
StackOverflow2013
Postsdbo
POjQuery change function to each element
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery change function to each element
    text
    copied!<p>I'm trying to find the height of each image with a class of portfolio.Img, then apply it to a sibling div with a class of <code>.overlay</code>. And if that height is less than 500, display none two children of overlay with an id of page_categories and a class of <code>.entry</code>.</p> <p>This works but only for one image not all images on the page:</p> <pre><code>&lt;script&gt; $(document).ready(function () { $('img.portfolioImg').load(function() { var imgHeight = $('img.portfolioImg').height(); $('.overlay').css('height', imgHeight - 40 + 'px'); if ( $('.overlay').height() &lt; 500 ) { $('#page_categories').css('display', 'none'); $('.entry').css('display', 'none'); }else{ // do nothing } }); }); &lt;/script&gt; &lt;div class="ct-coll-item col2 masonry-brick"&gt; &lt;article&gt; &lt;img class="portfolioImg" src="_/img/13.png" /&gt; &lt;div class="overlay"&gt; &lt;div id="page_categories"&gt; &lt;a href="#"&gt;Publication&lt;/a&gt;, &lt;a href="#"&gt;Typeface&lt;/a&gt; &lt;/div&gt; &lt;h2&gt;&lt;a href="#"&gt;Adam Howe Styles Men of Alaska for Port Magazine&lt;/a&gt;&lt;/h2&gt; &lt;div class="entry"&gt; &lt;p&gt;An experimental typographic project by Riccardo Sabatini, which is a typeface inspired by old mechanics technical drawings, the steampunk visual world, and modern machinery.&lt;/p&gt; &lt;/div&gt; &lt;footer class="postmetadata"&gt; &lt;time&gt;July 23rd, 2012&lt;/time&gt; / &lt;a href="#"&gt;1 Comment&lt;/a&gt; &lt;/footer&gt; &lt;/div&gt; &lt;/article&gt; &lt;/div&gt; </code></pre> <p>This <code>div.ct-coll-item</code> is repeated numerous times, I don't know how to apply <code>.each()</code> to make it work for all images and siblings/children.</p>
 

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