Sticky menu – nav-primary

[marcsaffar]

Hello,
I have allready published in themes forum
https://studiopress.community/topic/sticky-menu-nav-primary/#post-505838

I build a new site with latest genesis and genesis sample :
https://uhjfrance.marcsaffar.website/_tc/trial.php?t=63e110e5
I moved the main menu under the site-header by deactivating this in functions.php :
//remove_action( 'genesis_after_header', 'genesis_do_nav' );
//add_action( 'genesis_header', 'genesis_do_nav', 12 );

I disabled the sticky position of the site header in the css
I enabled a sticky position of the main menu in the css at line 1137 :

.js .nav-primary {
display: none;
position: sticky; /* was relative;*/
top: 0;/*added by me*/
z-index: 10;/*added by me*/
}
This works well except in Firefox (standard and developer edition) with which we get erratic scroll behaviors : return to the top of the page, large white spaces between the menu and the beginning of the content.

Then I did some changes :

restore default css here :
.js .nav-primary {
display: none;
position: relative;
}
and modified this line about 1564 :
/* Header Menu
--------------------------------------------- */

.nav-primary {
/*marc saffar ajoute*/
position: -webkit-sticky;
position: sticky !important;
top: 0;
z-index: 15;
/*fin de l'ajout*/
background-color: #063B6C;
padding-left: 30px;/*ajouté par marc saffar*/
clear: none;
float: left;/*marc saffar était right*/
width: 100%;/*marc saffar était auto*/
}

It seems to work a little bit better with same problem less often but it is not perfect.

Also I tested in a previous version of genesis sample and there is no problem at all. They changes some code since but it is not well documented at all.

I need a litlle help please.
Cheers

https://uhjfrance.marcsaffar.website/_tc/trial.php?t=63e110e5

[[email protected]]

nice

[Author]

Posts