StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>After a bit of sleuthing, I've figured this one out. In my case, I have 'slides', which contain my stellar elements, and they are sized to full width/height of the viewport. I needed to resize them for tablet orientation change.</p> <pre><code>$(window).resize(function(){ winHeight = $(window).height(); $("#scrollWrapper > div").height(winHeight); // Find out all my elements that are being manipulated with stellar var particles = $(window).data('plugin_stellar').particles; // Temporarily stop stellar so we can move our elements around // data('plugin_stellar') let's me access the instance of stellar // So I can use any of its methods. See stellar's source code $(window).data('plugin_stellar').destroy(); $.each(particles, function(i, el){ // destroy() sets the positions to their original PIXEL values. // Mine were percentages, so I need to restore that. this.$element.css('top', ''); // Once the loop is finished, re-initialize stellar if(particles.length - 1 == i){ $(window).data('plugin_stellar').init(); } }); }); </code></pre> <p>If it doesn't matter that the elements get set to their original pixel values for left/top, then you can just call destroy & init one after the other:</p> <pre><code>$(window).data('plugin_stellar').destroy(); $(window).data('plugin_stellar').init(); </code></pre> <p>If you instantiate stellar on an element (i.e., <code>$("#element").stellar();</code> instead of <code>$.stellar();</code>) then replace "window" with your selector.</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