Question

我目前正在使用Bootstrap 3，特别是Jasny Off Canvas Reveal Menu模板，请看这里：

https://jasny.github.io/bootstrap/examples/navmenu-reveal/

一切都很好，但是我想要实现并且不确定该怎么做，因为我不确定点击汉堡包菜单图标以显示侧面菜单时会发出什么点击事件但基本上我想要为了在这个网站上实现结果，当上面的Jasny示例显示按下菜单图标时，即：

在Material-UI网站上，菜单右侧的主要内容/画布在显示菜单时变暗，然后在侧边菜单消失时返回到原始状态。

我想在jasny off canvas上显示示例菜单点击。但主要的是，它需要在IE8浏览器上运行。

Answer 1

你可以简单地添加这个CSS：

.canvas-slid:after,
.canvas-sliding:after {
    content: "";
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: auto;
    z-index: 9999;
    background: rgba(0,0,0,0.5) !important;
    background: url(./alpha.png);
}

由于IE＆lt; = 8不支持rgba（），你可以使用1x1px 50％alpha-PNG作为BGimage 1。

侧边菜单出现时如何使网站的主要内容/画布变暗？

1 个答案: