The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript fixed menu stoping at footer

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #148575

    Dear css-tricks community, i’m struggling with some problems regarding a fixed menu item. I should mention that i’m still a beginner in javascript. I’ve searched the web and found this code on how to stop a fixed menu item for overlapping with the footer :

    <script src=""></script>
      function checkOffset() {
        var a=$(document).scrollTop()+window.innerHeight;
        var b=$('#footer').offset().top;
        if (a<b) {
          $('#menuC').css('bottom', '0px');
        } else {
          $('#menuC').css('bottom', (0+(a-b))+'px');

    and it’s working. Menu stops before the footer. The problems that i have now are:

    1) the menu item, depending on the height of the browser, is not always at the same spot. e.g. if the resolution is 1366 x 768 than the pixels above are almost ok, if the resolution is higher or lower than i need to change the numbers so that the menu stays where it should be. Should i change something on that code to make it compatible for all resolutions or should i put a complete different code that fits my needs best ?

    2) i added this code to one php file where the particular menu item is (just to experiment) but i want it to be everywhere else where the same menu is in use and it seems kinda troublesome to copy-paste it to each php file since there are a lot of them. Is there a way for example to include this code in the css where all the properties for the menu are or something along those lines so that i only have to write it once ?

    Sorry for the long post and please be patient with me.

    Thanks in advance lefty

Viewing 1 post (of 1 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.