问题描述:
今天想做一个响应式的导航栏,可汉堡导航图标一直没响应,找了半天原来是Bootstrap版本问题,它在IE11上无法运行。
解决:
换成最新的bootstrap版本(bootstrap-4.4.1)就好了。
其实说到底还是自己太过粗心吧!
当固定导航条遮挡住内容时应该怎么办?
直接在文档完成之后给它添加一个导航栏的高度,(我这里是固定在上部所以用padding-top),如果是固定在左边就是用padding-right.
<script type="text/javascript">
$(function () {
avoidHide();
function avoidHide() {
var onResize = function () {
// apply dynamic padding at the top of the body according to the fixed navbar height
$("html").css("padding-top", $(".fixed-top").height());
};
// attach the function to the window resize event
$(window).resize(onResize);
// call it also when the page is ready after load or reload
$(function () {
onResize();
});
}
});
</script>