当#rightdiv被隐藏时,如何将#leftdiv的宽度设置为100%,当单击该按钮时,两个div应该彼此相邻.
按钮点击时我已经将两个div相邻,但是当#rightdiv被隐藏时我想将#leftdiv扩展到100%.
function toggleSideBar() {
var div = document.getElementById('rightdiv');
if (div.style.display !== 'none') {
div.style.display = 'none';
}
else {
div.style.display = 'block';
}
};Run Code Online (Sandbox Code Playgroud)
#leftdiv
{
border: solid medium thick;
float: left;
display: inline-block;
background-color: #ffc;
/*border: 1px solid red;*/
}
#rightdiv
{
width: 50%;
border: solid medium thick;
background-color: #ffa;
display: none;
float:right;
}Run Code Online (Sandbox Code Playgroud)
<input type="button" id="btn" value="toggle" onclick="toggleSideBar()" />
<div id="main-content">
<div id="leftdiv">selectable</div>
<div id="rightdiv">right panel</div>
</div>`Run Code Online (Sandbox Code Playgroud)