Header is not showing up in mobile version

Store Design
, , , , ,
1

Hi! I have issue with header, which is not showing up when I’m scrolling my webpage. I know this is important feature for users and I can’t do it by myself, so maybe someone could help me with this?
https://lumitica.com

2

I believe you saying, sticky not working in mobile right? It seems like you have some JS to add and remove that sticky effect, first try to find that code and change the following value to 320 (you don’t want sticky on really really small screen device):

  • Try finding the following code in the header-script.js file, if not any file with .js
  • Change value to 320

kevinkarma55_0-1730041104002.png
kevinkarma55_0-1730041104002.png378×372 14.4 KB

1 Like
3

I found it in header-script.js, but when I change this value to 320 nothing happens.

// STICKY MENU ==============================================================================================
stickyHeader = function() {

var target = $(‘#page_header’);
var pseudo = $(‘#pseudo_sticky_block’);
var stick_class = ‘megamenu_stuck’;

$(window).on(‘load scroll resize’, function() {

if ( $(window).width() > 991 ) {
var scrolledValue = parseInt( $(window).scrollTop() );
var offsetValue = parseInt( pseudo.offset().top );
var headHeight = target.outerHeight();

if ( scrolledValue > offsetValue ) {
target.addClass( stick_class );
pseudo.css({ ‘height’ : headHeight });
}
else {
target.removeClass( stick_class );
pseudo.css({ ‘height’ : 0 });
};
}
else {
target.removeClass( stick_class );
pseudo.css({ ‘height’ : 0 });
};

});

$(window).on(‘load’, function() {
setTimeout(
function(){ $(window).trigger(‘scroll’) }
, 180 );
});

};

stickyHeader();
megamenuToggle();

4

are you sure, firstly can you answer you are talking about mobile view right?

5

Yeah. Right now when you are scrolling page on any mobile device it doesn’t show up.

6

IDK, that’s the only code I can figure out, make sure you are working on the current theme.