0
I am creating a responsive site manually, so I created 2 menus, one to appear on the desktop and another for mobile version. These menus are not at the top, but about 150 pixels away. I decided to create a script that allows me to fix the menu after the scroll achieve these 150px; Follows code
$(document).ready(function(){
var menu = $('.menu-geral-desktop');
function scroll() {
if ($(window).scrollTop() > 150) {
$('.menu-geral-desktop').addClass('menu-fixo-desk').fadeIn(500);
$('.menu-geral-desktop').fadeIn( );
$('.brand-topo-desk').css('display','block');
$('.itens-menu-desk').addClass('css-menu-centro-desk');
$('.menu-geral-mobile').addClass('menu-fixo-desk').fadeIn(500);
} else {
$('.menu-geral-desktop').removeClass('menu-fixo-desk');
$('.brand-topo-desk').css('display','none', 500);
$('.itens-menu-desk').removeClass('css-menu-centro-desk');
$('.menu-geral-mobile').removeClass('menu-fixo-desk');
};
};
document.onscroll = scroll;
});
On the desktop is working properly, the problem is in the mobile menu. The menu itself is fixed at the top after scrolling the 150 pixels, however when I open the dropdown, when scrolling the page, the options scroll along with the scroll, even though the menu itself is fixed at the top. Must be some configuration in CSS. Follow the styling of the mobile menu.
.itens-menu-mob{
float: left;
width: 100%;
margin-top: 00px;
z-index: 100000!important;
background-color: rgba(50,151,163,1.00);
display: none;
}
Someone can help me?
Parts of the CSS that can be dispensed with: float (since it will be fixed, no need). margin-top (no need to put 00px, put only 0, no px. When the value is 0, the px is dispensable). z-index (test without the ! Important. I think it will work and your code will be cleaner). background-color (the alpha value does not need to be in this format, put only 1. This value goes from 0 to 1, it can be . 1, . 2, . 3...).
– Sam
This dropdown is a <select>?
– Sam
In the first comment, ignore about the "float", I thought this CSS was the whole menu, but then I saw that it was the items.
– Sam