我使用 Bootstrap 3 作为我网站的框架。
通过这段代码,我在页面上显示了 2 个元素(div A 和 div B),每个元素的宽度为屏幕尺寸的 50%。
<div class="row">
<div class="col-lg-6" id="A"></div>
<div class="col-lg-6" id="B"></div>
</div>
我想通过单击按钮/元素关闭 div B 并将 div A 调整为屏幕的 100% 宽度。 如何使用 Bootstrap 做到这一点?是否有内置的 CSS 或 JavaScript 方式?
最佳答案
首先,您没有正确结束 DIV。而不是 </div
你应该使用 </div>
.然后,你可以用一些 jQuery 做你想做的事情,假设将被点击的按钮有一个 button
。编号:
$("#button").click(function(e) {
e.preventDefault();
$("#B").hide();
$("#A").removeClass("col-lg-6").addClass("col-lg-12");
});
或者,如果您想使用纯 JavaScript 来完成:
document.getElementById("button").onclick = function() {
document.getElementById("B").style.display = "none";
document.getElementById("A").className = "";
document.getElementById("A").className = "col-lg-12";
};
关于javascript - Bootstrap 关闭一个 div 调整另一个大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29722728/