Title: Broken Offset with sticky header
Last modified: December 18, 2018

---

# Broken Offset with sticky header

 *  Resolved [scoutx79](https://wordpress.org/support/users/scoutx79/)
 * (@scoutx79)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/)
 * I have to excuse myself, because i have already emailed you via contact form 
   some days ago.
 * I think, it could be an interesting topic for all users and we don’t have a totally
   private conversation.
    I have created this page [https://coaching-impulswerk.de](https://coaching-impulswerk.de)
   for a friend of mine.
 * I use a landing Desktop header and another sticky Desktop header for scrolling.
   
   The main menu uses anchor links. I’ve corrected the Desktop offset by (latest
   version): h2::before { display: block; content: ” “; margin-top: -125px; height:
   125px; visibility: hidden; pointer-events: none;
 * —–
    Ive also tried: a[ID]:before { content:””; display:block; height:90px; margin:
   0px 0 0;
 * and a lot more.
 * These Desktop menus are working, but the CSS is not working for the mobile menu.
   
   I’m pretty sure, all CSS is ignored and if not ignored, the mobile menu breaks(
   non clickable links e. g.). So not to break my links completely, I have created
   2 menus with different h2/anchor ids (desktop with h2 CSS vs mobile ids by possible
   anchor/a CSS. Sidenote: There is also an interesting bug if i use the actual 
   h2 CSS solution with the mobile menu. On Chrome, offset is not working but I 
   have an orange frame around the landing spot. The orange color is only used by
   the mobile admin menu.
 * Mobile menu: I think the offset is only calculated by the formula within mobmenu.
   js. And I don’t get it right. It seems to be either this calculation part will
   be ignored completely or the headerlength is misinterpreted.
    Actually the offset
   seems to be around 300px or more estimated by latest Chrome. There isn’t any 
   option for manually changing the value within the admin panel. I’ve tried to 
   edit the mobmenu.js to no avail. Most probably i havn’t found the correct solution.
   Btw. the js is vanilla again.
 * How can i land at the exact spot with anchor links on mobile menu and not breaking
   my other menus?
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fbroken-offset-with-sticky-header%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Plugin Author [Rui Guerreiro](https://wordpress.org/support/users/takanakui/)
 * (@takanakui)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11006654)
 * Hi [@scoutx79](https://wordpress.org/support/users/scoutx79/),
 * Thanks for opening the support topic here.
 * I would suggest the same thing I did when I replied to you. Can you turn WP Mobile
   Menu off to so can have a look where the scroll stops?
 * Thanks
 *  Thread Starter [scoutx79](https://wordpress.org/support/users/scoutx79/)
 * (@scoutx79)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11007403)
 * Thank you,
    I have deactivated the mobile menu.
 * Marc
 *  Plugin Author [Rui Guerreiro](https://wordpress.org/support/users/takanakui/)
 * (@takanakui)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11007631)
 * Thanks. If you notice it also has a margin when I pressed in coaching.
    [https://cl.ly/8bf492ae3489](https://cl.ly/8bf492ae3489)
 * Another thing I noticed was that the url didn’t changed to the [https://coaching-impulswerk.de/#oaching](https://coaching-impulswerk.de/#oaching)
 * Maybe it can also be a conflict from any other plugin or the theme functionalities.
   Not sure if you have a staging environment where you can try to deactivate all
   plugins to see what happens.
 *  Plugin Author [Rui Guerreiro](https://wordpress.org/support/users/takanakui/)
 * (@takanakui)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11012126)
 * [@scoutx79](https://wordpress.org/support/users/scoutx79/)
 * I had another look and not sure what is conflicting but removing a piece of code
   does the trick.
 * Let’s try to remove the code below from the line 178 to the 201 inside the mobmenu.
   js
 *     ```
          if (target.length) {
                 // Only prevent default if animation is actually gonna happen
                 event.preventDefault();
                 event.stopPropagation();
                 $( '.show-nav-left .mobmenu-left-bt').first().click();
                 $( '.show-nav-right .mobmenu-right-bt').first().trigger( 'click' );
                 $( 'html' ).css( 'overflow', '' );
   
                 $('body, html').animate({
                 scrollTop: target.offset().top + 400
                 //  scrollTop: target.top 
                 }, 1000, function() {
                   // Callback after animation
                   // Must change focus!
                   var $target = $(target);
                   $target.focus();
                   if ($target.is(":focus")) { // Checking if the target was focused
                     return false;
                   } else {
                     $target.attr('tabindex','-1'); // Adding tabindex for elements not focusable
                     $target.focus(); // Set focus again
                   };
                 });
               }
       ```
   
 * Will create an option for the next update to disable/enable this smooth scroll
   feature in WP Mobile Menu.
 *  Thread Starter [scoutx79](https://wordpress.org/support/users/scoutx79/)
 * (@scoutx79)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11013472)
 * Thank you,
    so it was the target.length / smooth scroll method.
 * This helps alot. I think, i can implement two different offset lenghths now.
 *  Plugin Author [Rui Guerreiro](https://wordpress.org/support/users/takanakui/)
 * (@takanakui)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11016138)
 * That’s great. Happy to help.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Broken Offset with sticky header’ is closed to new replies.

 * ![](https://ps.w.org/mobile-menu/assets/icon-128x128.png?rev=1890426)
 * [WP Mobile Menu - The Mobile-Friendly Responsive Menu](https://wordpress.org/plugins/mobile-menu/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/mobile-menu/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/mobile-menu/)
 * [Active Topics](https://wordpress.org/support/plugin/mobile-menu/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/mobile-menu/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/mobile-menu/reviews/)

## Tags

 * [class](https://wordpress.org/support/topic-tag/class/)
 * [fixed](https://wordpress.org/support/topic-tag/fixed/)
 * [offset](https://wordpress.org/support/topic-tag/offset/)

 * 6 replies
 * 2 participants
 * Last reply from: [Rui Guerreiro](https://wordpress.org/support/users/takanakui/)
 * Last activity: [7 years, 4 months ago](https://wordpress.org/support/topic/broken-offset-with-sticky-header/#post-11016138)
 * Status: resolved