Почему отзывчивое меню появляется в представлении на рабочем столе при кодировании в JS/CSS? ⇐ Html

[Anonymous]

Код: Выделить всё

                let doc = document.getElementById('bar');
let doc2 = document.getElementById('mobile');
let clk = false;
doc.onclick = function(){
clk=!clk;
if(doc.hasAttribute('style','transform:rotate(-450deg) translate(0px,0px);') && !clk){
doc.setAttribute('style','transform:rotate(0deg) translate(0px,0px);');
doc2.setAttribute('style','display:none !important;');
}else{
doc.setAttribute('style','transform:rotate(-450deg) translate(0px,0px);');
doc2.setAttribute('style','display:block !important;');

}
};< /code>
*, *::before, *::after {
box-sizing: inherit;
background:#000;
}

::-webkit-scrollbar {
width: 3px;
height: 10px;
}

::-webkit-scrollbar-thumb {
background: grey;
}

body,p{
padding:0;
margin:0;
}
.wrapper{

display:flex;
justify-content: center;
align-items: center;

}
.container{
width:1400px;
height: 900px;
overflow: hidden;
}
#nav-bar{
display:block !important;
margin: 0 auto;
height: 100px;

}

#mobile{
display:none !important;
}

.pos{
font-size: 26px;
}
.wrap{
display: none;
}

ul{

list-style-type: none;
margin-left:0;
padding-left:0;
display: flex;
}

li{
font-size: 16px;
width: max-width;
margin-right: 3em;

}
a{

text-decoration: none;
color: #fff;
transition: color 1s ease-in;
}

a:hover{
color: lightgreen;
}

@font-face{
font-family: 'F37 Qbik';
src: url('/fonts/F37QbikTrial-Regular.otf') format('opentype');
font-weight: normal;
font-style: normal;
}

body{
font-family: 'F37 Qbik';
color: white;
font-size: 1.6rem;
}

h1{
font-size: 60px;
font-weight: 400;
line-height: 4rem;
letter-spacing: -.0125em;
}
.order{
display:flex;
flex-direction: row;
justify-content: space-between;
}
.image{
order:2;
flex:1.5;

}
.bodyText{
order:1;
flex:1;

}

img{
max-width:100%;
height: auto;
display:block;
}
footer{
font-size:1rem;
}

@media only screen and (max-width: 400px){
body{
font-size: 1.5rem;
}
.wrapper{
display:flex;
width: 100%;
}

#bar{
color: #fff;
background-color: #fff;
height: 5px;
width: 25px;
margin:5px;
transition: .3s ease-out;

}

#mobile{

display: none !important;
height: 50px;
min-width: 100px;
position: absolute;
top:50px;
left:20px;
z-index:100;

}
#nav-bar{
display: none !important;
}

h1{
font-size: 2rem;
letter-spacing: 0;
line-height: 36px;
}

.order{
display:flex;
flex-direction: column;
justify-content: center;
align-items:  center;

}
.image{
order:1;

}
.bodyText{
order:2;
margin: 0 20px;
}
img{
max-width:100%;
max-height:100%;
object-fit: contain;
display:block;
}

.button{
position: relative;
left:0;
margin-left: 20px;
margin-right: 20px;
}

.main_btn{
display: inline-block;
background-color: #fff;
color: #000;
padding: 2.5px 10px;
}
hr{
margin-left: 20px;
margin-right: 20px;

}

footer{
font-size: .75rem;
margin-left:20px;
margin-right: 20px;
}

}< /code>
    
Test Website
[*]










[list]
Home
[*][url=about.html]About[/url]
[*][url=prices.html]Prices[/url]
[*][url=contact.html]Contact[/url]
[/list]





[url=about.html]Item1[/url]
[url=prices.html]Item2[/url]


[img]/images/car.png[/img]

Showcase your thought provoking topics
and ideas.

Big company announcement or simple
sub-header taking two or more lines.



[list][*]Button[*]Text link[/list]




Anything about the company's copyright can go here.

Я пытаюсь получить работу настольного компьютера/адаптивного веб -сайта, но меню из адаптивного представления появляется в представлении на рабочем столе ...
Меню Hamburger работает нормально в режиме реагирования, нагрузка и не загружает меню. Но когда я загружаю меню из режима адаптивного режима и переключаюсь в режим рабочего стола, меню есть (в режиме рабочего стола).
Любая помощь в этом будет оценена ...

Подробнее здесь: https://stackoverflow.com/questions/796 ... -in-js-css