abouolia / sticky-sidebar

😎 Pure JavaScript tool for making smart and high performance sticky sidebar.
https://abouolia.github.io/sticky-sidebar/
MIT License
2.23k stars 489 forks source link

StickySidebar not updating after update html content inside #128

Open NicoxDJ opened 3 years ago

NicoxDJ commented 3 years ago

So i'm using the script in 2 divs

<div id="sticky-sidebar" class="summaryShortContainer column large-4 text-white text-14 margin-top-45 padding-0 ">
    <div class="sidebar__inner">

With this code initialization:

<script type="text/javascript">
    $(document).ready(function () {
        $('#sticky-sidebar').stickySidebar({
            innerWrapperSelector: '.sidebar__inner',
            topSpacing: 16,
            bottomSpacing: 16,
            minWidth: 1023
        });
    });
</script>

So far is good, everything seems to work. But after i update the sidebar with new information via jQuery and update it:

$('.summaryShortContainer').html(data);

var sidebar = $('#sticky-sidebar').stickySidebar({
    containerSelector: '#sticky-sidebar',
    innerWrapperSelector: '.sidebar__inner',
    minWidth: 1023,
    resizeSensor: true,
    topSpacing: 16,
    bottomSpacing: 16,
});
sidebar.stickySidebar('updateSticky');

It updates the information, removes the .sidebar__inner styles and while moving sets #sticky-sidebar class is-affixed and style height: 0px; position: relative;, but .sidebar__inner tags are empty.

No matter what i do, just nothing. Not even a console error. What i'm doing wrong?

hacmak18 commented 3 years ago

I am also facing the same issue. when i call updateSticky()

NicoxDJ commented 3 years ago

@hacmak18 no, i didn't found how to update it. I just change the update class. I update everything inside .sidebar__inner so i don't have to touch it's settings.