I am trying to make my div (floating-sidebar) appear at the top when the user scrolls down the page, and once the user scrolls to the top, the element should not overlap the nav bar.
I am struggling to implement this, so help would be appreciated. This is what I have tried:
<div id="floating-sidebar-sticky-wrapper" class="floating-sidebar-wrap" style="height: 696px;">
<div id="floating-sidebar"></div>
</div>
<script>
$(window).on('load',function(){
$("#floating-sidebar").sticky({ topSpacing: 0, wrapperClassName: "floating-sidebar-wrap" });
});
</script>