MooK

I don’t use reCapcha at all tho.

Hi Kharis

I try on different mobile devices, it doesn’t work.
A other suggestions?

thanks

Hi Kharis.

Thanks. But it still not responding when I scroll back to top …

Hi Kharis.

Thanks for providing the code.
But it still doesn’t open every time when I scroll back to top of the page.

Could you please look into it again.

thanks

Hi Kharis.

Thank you very much. It works great. Except one little issue:
When you scroll down then all the way up back to the initial header, the menu doesn’t open. Could you please take a look into it?

Thanks

Hi Kharis.
Sorry for bothering you, but any updates?

thanks

Hi Kharis (@kharisblank).

the code is from here (Sydney theme). If you will look at the scrolling on mobile device it’s so smooth. and I like how sticky menu bar appears on the top of the screen. It was jumping before and wasn’t as perfect as now, after you provided the code. I would like you, please, to make Ingis to work the same way.

thanks

Hi Kharis.

I was testing it on here.

Also I wanted to have menu bar stick on top of the screes while I am scrolling up and down.
Very similar to the code provided for Sydney theme:

jQuery(function($) {

  if ( matchMedia( 'only screen and (max-width: 1024px)' ).matches ) {

    var headerFix = $('.site-header').offset().top;
    var vDistance = headerFix+280;

    var inserated = false
    $(window).on('load scroll', function() {
      var y = $(this).scrollTop();
      if ( y >= vDistance) {

        if(inserated == false){
          var newHead = $('#masthead').clone();
          
          (newHead).prependTo('body').addClass('masthead-clone').animate({
            top: 0
          }).resize();

          $('.masthead-clone .btn-menu').on('click', function() {
              $('.masthead-clone #mainnav-mobi').slideToggle(300);
              $(this).toggleClass('active');
          });

          $(document).on('click', '.masthead-clone #mainnav-mobi li .btn-submenu', function(e) {
              $(this).toggleClass('active').next('ul').slideToggle(300);
              e.stopImmediatePropagation()
          });          
          
          inserated = true;
          
        }    
        
      } else {
      
        $('.masthead-clone').animate({
          top: -200
        }).remove();
        inserated = false;
        
      }

    });
  
  }

});

Thanks

with new update it still doesn’t work…

hi Kharis Sulistiyono (@kharisblank)

By the chance are you supporting Ignis theme as well?

Ok Roman.

I will do it by myself.
But please, could you look into issue with jumping banner part when you first start scrolling the page on mobile screen.
It will be easier for me to do the rest, If you will fix the bug first.

Thanks

Hi Roman.

I don’t think that it will cover most of the whole screen. It will keep just a menu bar with mobile menu icon on top of the screen.
Very similar to the code provided by your colleague for Sydney theme:

jQuery(function($) {

  if ( matchMedia( 'only screen and (max-width: 1024px)' ).matches ) {

    var headerFix = $('.site-header').offset().top;
    var vDistance = headerFix+280;

    var inserated = false
    $(window).on('load scroll', function() {
      var y = $(this).scrollTop();
      if ( y >= vDistance) {

        if(inserated == false){
          var newHead = $('#masthead').clone();
          
          (newHead).prependTo('body').addClass('masthead-clone').animate({
            top: 0
          }).resize();

          $('.masthead-clone .btn-menu').on('click', function() {
              $('.masthead-clone #mainnav-mobi').slideToggle(300);
              $(this).toggleClass('active');
          });

          $(document).on('click', '.masthead-clone #mainnav-mobi li .btn-submenu', function(e) {
              $(this).toggleClass('active').next('ul').slideToggle(300);
              e.stopImmediatePropagation()
          });          
          
          inserated = true;
          
        }    
        
      } else {
      
        $('.masthead-clone').animate({
          top: -200
        }).remove();
        inserated = false;
        
      }

    });
  
  }

});

Will it be fixed by the next theme update?

Thanks Roman!

Thanks Roman!!!