Fixed header on mobile causes lag on content

[van_Houten]

Hi,

I wanted to have a fixed header on mobile. So i added the following code:

@media (max-width: 979px) {
.site {
margin-top: 69px;
}
.x-navbar {
position: fixed !important;
width: 100%;
left: 0;
top: 0;
right: 0;
}
}

The fixed header works almost fine on mobile. But since the header is fixed the content lags. I tested it on a iphone 6.

How can i fix this?

Thank you in advance.

[christian]

Hey Yoram,

Regretfully, I don’t see any lagging in your site on mobile. Would you mind providing specific details of the behavior you’re experiencing? Also ensure your phone’s OS and browser is supported by WordPress. See https://make.wordpress.org/core/handbook/best-practices/browser-support/

Thanks.

[van_Houten]

Hi Christian,

Thank you for your reply.

I added a video link so you can see what the problem is.
The content loads slow when you scroll on the website.

My browser supports te latest wordpress version. On safari and chrome.

Kind regards,
Yoram

[christian]

Hey Yoram,

It looks like a script or display conflict with Slider Revolution and The Grid. The combination of the slider and the grid might not be a good setup as it might be heavy for the phones resources. Would you mind removing that fixed header custom CSS and see if the issue persists? If it does, please try applying the solutions outlined at https://www.themepunch.com/faq/troubleshooting-tips-for-5-0/.

If that does not help, please try removing the grid and replace it with a simple setup. You can achieve a similar setup using

• Marginless 6 Column Row
• Add image background to each column
• Add a headline to each column

Thanks.

[van_Houten]

Hi Christian,

I tried everything but it didn’t work.
I tried all the troubleshooting from themepunch, removed te grid, removed te fixed header css.
As you can see the ‘categorieën’ balk also lags. And that is just a simple section.

I tried the mobile website on another phone and an another network and it’s the same issue…

I uploaded a new video in the previous link. So you can see it by yourself.

[christian]

Hey Yoram,

Thanks for the new video. I’ve tested in another phone and I see the lag. This looks like the particular animation of Slider Revolution is really heavy for mobile devices in general moreover since the troubleshooting suggestions did not work.

Regretfully, there is nothing we could do in this case but to post this in our issue tracker so this scenario would be forwarded to ThemePunch in due time. Please export your slider and put it in a zip file and upload in a file sharing service like Dropbox and give us the download link.

Thanks.