可以使用相同的图标打开和关闭模态吗?

时间:2015-04-28 11:20:44

标签: css3 css-transitions bootstrap-modal

我想知道我是否可以使用"相同的"触发全屏,半透明Bootstrap模式(我已定制)的图标(或看起来相同的东西)弹出,然后用位于同一位置的图标关闭它。

然而,说它在普通页面上最初是一个汉堡包图标,当我点击图标弹出模态菜单时,它现在在模态下。有没有办法让它保持在一个模态的顶部?我试过z-index,但我无法让它工作。

对我来说最棘手的事情是,我希望将图标从汉堡包转换为X,然后在关闭时反之亦然:http://sarasoueidan.com/blog/navicon-transformicons/

最初我希望我可以让图标转换,然后以某种方式将图标设置在所有内容之上,包括模态。

任何想法或建议都会很棒,谢谢。

1 个答案:

答案 0 :(得分:0)

应该可以使用z-index执行此操作。但是,z-index仅适用于具有" position"设置为"静态"以外的东西(默认)。尝试将position: relative添加到您的打开/关闭按钮,希望您应该能够使用z-index将按钮保留在叠加层前面。

CSS Tricks上有关于z-index的更多信息,这是一个很好的参考。