Adjust topMargin on resize

[generatepress]

This is an issue when using with WordPress and other applications with a toolbar.

The topMargin can change depending on screen size.

Would be great if there was a way to update it, or even a destroy method so we could destroy the current instance and re-initialize using the updated topMargin setting.

[ppowalowski]

Hi,

I got the point. So you want topMargin to be somehow dynamic or at least a control over reinitialization, right?

Can you make up a mockup or something so one could dive in with development right into this specific case? This request sounds useful.

[tomusborne]

It's not that difficult, we just need a destroy function so we don't re-initialize on resize:

function getOffset( el ) {
    return ( jQuery( el ).length > 0 && jQuery( el ).css( 'position' ) == 'fixed' ) ? jQuery( el ).outerHeight() : 0;
}

resizeEvent = 'onorientationchange' in window ? 'orientationchange' : 'resize'

var myEfficientFn = debounce(function() {
    // Detroy/unstick here
    el.stickUp({
        topMargin: getOffset( '#wpadminbar' ),
    });
}, 250);

window.addEventListener( resizeEvent, myEfficientFn );

StickyKit has the detach trigger which works: https://github.com/leafo/sticky-kit/blob/master/dist/sticky-kit.js#L226

[ppowalowski]

Hi,

thanks for your contribution. Actually the best solution would be to update just the margin and recalculate, right?

Please take note that controbution for adding an API for event emmission and listening would be highly appreciated. (See Contribution in Readme)