我已经搜索了我的问题的所有可能的原因，但一无所获。我正在使用Bootstrap，我有一个折叠的导航栏，当点击它时，在按钮下面生成一条线，但不显示菜单。然后，第二次点击它，它 Flink 的菜单，但它很快就自动消失，不会保持可见。
我相信这是一个简单的修复，但我是新的，所以它不是那么简单的我;寻求一些指导。谢谢。
我不知道有多少代码和什么代码张贴在这里，所以我会把链接以及：eci.surge.sh

<nav id="nav">
    <div class="row">
        <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
            <a href="#" class="scroll-top"><img src="assets/images/ecsi_logo2.jpg" style="max-height: 50px; padding-top: 7px;" class="center-block" alt="ECI Logo"></a>
        </div>
        <div class="col-lg-10 col-md-10 col-sm-8 col-xs-6 inline-block">
            <nav class="navbar navbar-default navbar-transparent">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav">
                            <span class="sr-only">Toggle Navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="#"></a>
                    </div>
                    <div id="main-nav" class="collapse navbar-collapse">
                        <ul class="nav navbar-nav navbar-right">
                            <li><a href="#" class="scroll-link" data-id="about"><strong>About</strong></a></li>
                            <li><a href="#" class="scroll-link" data-id="construction"><strong>Construction</strong></a></li>
                            <li><a href="#" class="scroll-link" data-id="environmental"><strong>Environmental</strong></a></li>
                            <li><a href="#" class="scroll-link" data-id="vacuum"><strong>Vacuum Services</strong></a></li>
                            <li><a href="#" class="scroll-link" data-id="coatings"><strong>Coatings</strong></a></li>
                        </ul>
                    </div>
                </div>
            </nav>
        </div>
    </div>
</nav>

CSS

#nav { 
height:70px;
width: 100%;
position:fixed;
padding-top: 2px;
top:0;
left:0;
background-color:#ac0008;
z-index:9999;
display: none; 
}

.navbar {
background-color: transparent;
background: transparent;
border-color: transparent;
}

.navbar .nav > li > a {
float: none;
font-size: 18px;
line-height: 26px;
padding: 9px 10px 11px;
text-decoration: none;
color:  #ddd;
text-transform: uppercase;
padding-top: 20px;
padding-bottom: 20px; 
}