Magnin-Template: Sticky Header - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!
Back to the questions

Magnin-Template: Sticky Header

R

RaBauKi

Template 3 years ago

Hi there,

I am currently building my page with the "Magnin" template (Joomla 4.0.5 / php 7.4) and have problems with a transparent sticky header menu:

In the template options I selected the "Fullwidth Center" header (60px header height). I made it partially transparent via CSS and added the following custom CSS:

.sticky-header-placeholder
{
   height: 0px! important;
}

The aim should be that the page content, especially images, shimmer through the header. The page content should always start at the top of the screen behind the header.

This works with all browsers the first time the page is called up, but when you scroll, the page content moves down 60px depending on the browser or the Header is jumping up or down.

Firefox on the desktop shows the Problem sometimes, Samsung browser on the Android smartphone show the problem extremely, Chrome on Android seems to works.

How can you solve this problem? Best regards

0
1 Answers
Order by
Oldest Newest Votes
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 years ago #48597

Hi there!

Thanks for contacting us.

Please remove the code you have mentioned earlier, and use the following code instead:

.view-category #sp-main-body {
    padding-top: 0;
    margin-top: -60px;
}

This may resolve the issue for you I hope. I have checked with Edge and firefox.

Best Regards

0