代理中的标题菜单未固定 - 启动 Bootstrap 主题

Question

我正在使用 Agency - Start Bootstrap simple one pager html 主题。 主题工作正常。 但我进行了更改，我添加了一个具有大图像的新部门。

这是我的代码。

<body id="page-top" class="index">

<div class="navbar-default  navbar-fixed-top">
<a class="navbar-brand page-scroll" href="#page-top"><img style="height:55px;width:150px;" src="http://unicca.in/images/logo.png"></img></a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>



    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" >
            <ul class="nav navbar-nav navbar-right  "  >
                <li class="">
                    <a href="#page-top"> Home</a>
                </li>
                <li>
                    <a class="page-scroll" href="#services">Corporate</a>
                </li>
                <li>
                    <a class="page-scroll" href="#portfolio">Projects</a>
                </li>

                <li>
                    <a class="page-scroll" href="#team">Career</a>
                </li>
                <li>
                    <a class="page-scroll" href="#tools">Buyer Tools</a>
                </li>
                <li>
                    <a class="page-scroll" href="#investor">Investor</a>
                </li>

                <li>
                    <a class="page-scroll" href="#contact">Contact</a>
                </li>
            </ul>


        </div>
        </div>

请检查这个网站的样子

我的网站

问题：我想要在我的大图像之后的标题菜单。 但它来自那个图像。 怎么做。 我在更改 css 方面做了很多尝试，但它带来了其他一些问题。 如何解决。

我的 css 文件是css 链接

小鬼：如果使用 navbar-staic-top 而不是 navbar-fixed-top 那么它会下降，但它不会作为固定菜单工作。

Answer 1

然后你改变你的 html div 结构，像这样用 jQuery 添加固定在滚动上的位置

<div class="my-class">
<!--add banner div-->
<div class="banner">
  <img alt="myhome" style="width:100%;height:700px;"     src="http://cdn.freshome.com/wp-content/uploads/2013/08/selling-your-home-exterior-home-color.jpg">
</div> 

<!--add nv div-->
<div class="navbar-default navbar-shrink"><!--remove nav-topbar-fixed div-->
    <a class="navbar-brand page-scroll" href="#page-top"><img style="height:55px;width:150px;" src="http://unicca.in/images/logo.png"></a>
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav navbar-right  ">
                    <li class="active">
                        <a href="#page-top"> Home</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#services">Corporate</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#portfolio">Projects</a>
                    </li>

                    <li>
                        <a class="page-scroll" href="#team">Career</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#tools">Buyer Tools</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#investor">Investor</a>
                    </li>

                    <li>
                        <a class="page-scroll" href="#contact">Contact</a>
                    </li>
                </ul>


            </div>
            </div>

</div>

CSS：删除位置固定

.navbar-default .navbar-collapse{
  position: fixed; /**remove**/
}

Answer 2

Nayana，你的意思是菜单总是显示在浏览器的底部，对吧？ 如果是这样，试试这个，编辑agency.css并将.navbar-fixed-top{top:0px}更改为.navbar-fixed-top{bottom:0px}

代理中的标题菜单未固定 - 启动 Bootstrap 主题

问题描述

2 个解决方案

解决方案1
0 2015-03-25 09:26:22

解决方案2
0 2015-04-13 13:53:28

代理中的标题菜单未固定 - 启动 Bootstrap 主题

问题描述

2 个解决方案

解决方案1 0 2015-03-25 09:26:22

解决方案2 0 2015-04-13 13:53:28

解决方案1
0 2015-03-25 09:26:22

解决方案2
0 2015-04-13 13:53:28