Databases
StackOverflow2013
Postsdbo
POIsotope element dynamic height
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POIsotope element dynamic height
    text
    copied!<p>I'm using isotope on my tumblr theme, but my post (which is an isotope-item) - on a permalink page - will not increase its height after loading more notes. These notes are dynamically inserted after one clicks a link. I've found a possible solution to this by calling <code>.isotope('reLayout');</code> but it seems I can't get it to work. It will load the new notes, but they get cut off by their container which doesn't increase height at all.</p> <p>I tried doing it with a click event on the 'show more notes' link, but that link already has inline javascript being executed on click. How can I have the isotope item increase its height (by executing <code>.isotope('reLayout');</code>) on the click of the 'show more notes' link?</p> <p>Here's the default tumblr code:</p> <pre><code>&lt;li class="note more_notes_link_container" style="text-align:center;" id="more_notes_59995759535"&gt; &lt;a class="more_notes_link" rel="nofollow" href="#" onclick="this.style.display='none';document.getElementById('notes_loading_59995759535').style.display = 'block';if(window.ActiveXObject)var tumblrReq=new ActiveXObject('Microsoft.XMLHTTP');else if(window.XMLHttpRequest)var tumblrReq=new XMLHttpRequest();else return false;tumblrReq.onreadystatechange=function(){if(tumblrReq.readyState==4){var notes_html=tumblrReq.responseText.split('&lt;!-- START '+'NOTES --&gt;')[1].split('&lt;!-- END '+'NOTES --&gt;')[0]; if(window.tumblrNotesLoaded)if(tumblrNotesLoaded(notes_html)==false)return;var more_notes_link=document.getElementById('more_notes_59995759535');var notes=more_notes_link.parentNode;notes.removeChild(more_notes_link);notes.innerHTML+=notes_html;if(window.tumblrNotesInserted)tumblrNotesInserted(notes_html);}};tumblrReq.open('GET','/notes/59995759535/YbpaUsPSt?from_c=1378154277',true);tumblrReq.send();return false;"&gt;Show more notes&lt;/a&gt;&lt;span class="notes_loading" id="notes_loading_59995759535" style="display:none;"&gt;Loading...&lt;/span&gt; &lt;/li&gt; </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