Witam,
wcześniej zadałem podobne pytanie, co prawda ruszyło się coś do przodu, ale ciągle czegoś brakuję, więc zadam pytanie jeszcze raz.
Mam kod:
$(document).ready(function()
{
$("nav").hide();
$("#button-menu").click(function()
{
$("nav").toggle("slow");
});
});
if (window.getBoundingClientRect().width > 800)
{
$("nav").show();
}
nav
{
display: flex;
justify-content: center;
.nav-pills
{
.nav-item
{
flex-direction: row;
}
}
}
@media screen and (max-width: 800px)
nav
{
}
.nav-pills
{
justify-content: space-between;
align-items: center;
flex-direction: column;
}
}
}
@media (min-width: 801px)
{
.container
{
nav
{
}
.hamburger
{
display: none;
}
}
}
(Pominąłem niektóre wycinki kodu, żeby było bardziej czytelnie, typu paddingi, background'y etc)
Problem:
* nawigacja jak width > 800 nie pokazuję się (jakby jej w ogóle nie było)
if (window.getBoundingClientRect().width > 800) { $("nav").show(); }
Wydaję mi się, że coś z tym może być nie tak, aczkolwiek próbowałem różnych kombinacji i za każdym razem albo coś z wersją mobile było źle, albo z desktopową.