I would like to create a sidebar that will overlap with a column in bootstrap.
(我想创建一个与引导程序中的列重叠的边栏。)
When I click a button on the screen, the sidebar will appear and when I click x , the bar will disappear.(当我单击屏幕上的button时，将出现侧栏，而当我单击x ，该栏将消失。)
I am using Bootstrap row and column layout for my page.(我正在为页面使用Bootstrap行和列布局。)
For some reason, the bar would go to the bottom of the page and the button would not respond to my click.(由于某些原因，该栏会转到页面底部，并且该按钮不会响应我的单击。)
My HTML is:
(我的HTML是：)
<body class="container-fluid">
<div class="row>
<div class="col-8">...</div>
<div class="col-4">...</div>
<div id="mySidenav"></div>
</div>
<span id="pr-btn" style="position:fixed;font-size:30px;cursor:pointer">☰ open</span>
</body>.
My CSS is
(我的CSS是)
#mySidenav {
position: abolute;
width: 0;
right: 0;
height: 100%;
background-color: #123456
}
My JQuery is
(我的JQuery是)
$("#pr-btn").click(() => {
let width = $("#mySidenav").css("width");
if(width == 0) {
$("#mySidenav").css("width", "33.3%");
} else {
$("#mySidenav").css("width", "0");
}
})
ask by rockpang translate from so
与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
