Sticky menu adjustment question

[Support]

Hey, so I have coded your sidebar on the sidebar example page to scroll with one of my pages (or stay fixed after a certain point) using jquery and css.  Before the update with the sticky menu it worked great, however after the update a portion of it is hidden under the sticky menu.  Would you have any idea how I could correct this??
 
<style type=’text/css’>
 

  div.float {
    background-color: none;
}
 
div.expand { /* simply here to allow me to scroll*/
    height: 50px;
 
}
 

      </style>
 
<script type=’text/javascript’>//<![CDATA[
$(window).scroll(function(e) {
    // 40 is the offsetTop of the menu. This should be constant as such
    // it’s defined that way. To get your offsetTop you can use
    // document.getElementById(‘id’).offsetTop or $(‘selector’).offset().top
    if ($(window).scrollTop() > 300) {
        $(‘.float’).css({
            position: ‘fixed’,
            top: ‘0’
        });
    } else {
        $(‘.float’).css({
            position: ‘static’
        });
    }
});//]]>
 
</script>
 

---

[Support]

Hello, there are a few questions that are not covered by the support forum (like this one you posted which is a custom code question.)

But here you go, try this:

All the elements that are not “position:static” need a zIndex definition, so please add this:

$('.float').css({
            position: 'fixed',
            top: '0',
            z-index: '300'
        });

Adjust the z-index to the number you want – depending on the other elements.

🙂

---

[Author]

Posts