单击图标栏时，它会显示Navbar，但一出现就会消失

Question

以下是我的代码。点击按钮图标栏会显示导航栏，但会立即淡入。相反，当我们重新点击按钮或选择任何导航栏项时，它必须淡入。请帮忙。

<div class="navbar-wrapper">
<!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
    <nav class="navbar" role="navigation">

        <div class="navbar navbar-inverse">

            <div class="container-fluid">
                <div class="navbar-header">
                <button type="button" class="btn-navbar" data-toggle="collapse" data-target="#myNavbar">

                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>

                </button>
                <a class="brand" href="">Casino</a>

                </div>
                <div class="navbar-inner">
                <div class="collapse nav-collapse" id="myNavbar" >
                    <ul class="nav  navbar-nav">
                        <li><a href="" title="">Home</a></li>
                        <li><a href="#casino_games" title="Casino Games">Games</a></li>
                        <li><a href="#packages" title="Casino Packages">Packages</a></li>
                        <li><a href="#group" title="Casino Booking">Casino Booking</a></li>
                        <li><a href="#contact_us" title="">Contact Us</a></li>
                        <li><a href="#about_us" title="About ">About Us</a></li>

                    </ul>
                </div>

            </div>
        </div>
    </div></nav>
</div>

我的CSS代码如下：

.navbar-wrapper {
position: absolute;top: 0;left: 0;right: 0;z-index: 10;
margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
}

.navbar .navbar-inner {
font-family:Calibri;src:url(fonts/Calibri.ttf) format('truetype');
border: 0;
-webkit-box-shadow: 0 2px 10px rgba(0,0,0,0);
-moz-box-shadow: 0 2px 10px rgba(0,0,0,0);
box-shadow: 0 2px 10px rgbargba(0,0,0,0);}

.navbar .brand {
color:#ffd13b;
padding: 14px 20px 16px; /* Increase vertical padding to match navbar links */
font-size: 16px;font-weight: bold;}

/* Navbar links: increase padding for taller navbar */
.navbar .nav > li > a {padding: 15px 20px;}
/* Offset the responsive button for proper vertical alignment */
.navbar .btn-navbar {margin-top: 10px;}

@media (max-width: 979px) {
.container.navbar-wrapper {margin-bottom: 0;width: auto;}
.navbar-inner {border-radius: 0;margin: -20px 0;}
.carousel .item {height: 500px;}
.carousel img {width: auto;height: 500px;}
.featurette {height: auto;padding: 0;}
.featurette-image.pull-left,.featurette-image.pull-right {display: block;
float: none;max-width: 43.2%;margin: 0 auto 20px;}
}

@media (max-width: 767px) {
.navbar-inner {margin: -20px;}
.carousel {margin-left: -20px;margin-right: -40px;}
.carousel .container {}
.carousel .item {height: 300px;}
.carousel img {height: 300px;}
.carousel-caption {width: 65%;padding: 0 70px;margin-top: 100px;}
.carousel-caption h1 {font-size: 30px;}
.carousel-caption .lead,.carousel-caption .btn {font-size: 18px;}
.marketing .span4 + .span4 {margin-top: 40px;}
.featurette-heading {font-size: 30px;}
.container_games h1 {font-size: 30px;}

.featurette .lead {font-size: 18px;line-height: 1.5;}
#contact_form{margin-left:5%;}
input{background-color:#ffffff; color:#030000;}
.featurette img{margin-left:7%;}

}